Как прописать путь к файлу css

Путь к файлу css

Наверняка вы уже сталкивались с необходимостью вставки на своём сайте изображений, видео или какого-то файла для скачивания. При решении этой задачи много проблем возникает именно из-за неправильно прописанного пути к файлу. Давайте разбираться как же правильно прописать путь к файлу.

Навигация по статье:

Путь к файлу это своего рода его адрес содержащий в себе цепочку (последовательность) папок, внутри которых он находится. Путь может быть абсолютным и относительным.

Что такое абсолютный путь к файлу?

Если говорить простым языком, то это полный путь к файлу, который содержит в себе название сайта, протокол http или https, название папок, внутри которых он находится, а так же его имя и расширение.

Например, для картинки image.png, которая лежит в папке images на вашем хостинге абсолютный путь будет выглядеть так:

Когда вы создаёте HTML страницу на компьютере у вас абсолютный путь будет начинаться не с HTTPS, а с названия диска, на котором этот файл находится. Затем будет идти последовательность папок внутри которых он лежит, а уже потом имя файл и его расширение.

Посмотреть этот путь можно в адресной строке:

Как определить абсолютный путь к файлу у себя на хостинге?

Часто при подключению к сайту по FTP или файловый менеджер на хостинге у вас открывается корневая папка, в которой находится куча других папок и не всегда понятно где находится сама папка с доменом, куда загружать файл и какие папки указывать в абсолютном пути.

В этом случае нам нужно:

    1. Найти папку, в которой лежат файлы сайта.
    Например, в случае с CMS WordPress в ней должны находиться папки «wp-admin», «wp-content» и так далее.

Потом приписываем к нему скопированный адрес папки с загруженным файлом и в конце пишем название его название и расширение.

Особенности абсолютного пути:

  • указанный адрес будет работать при его использовании на других сайтах или страницах
  • при смене домена основного сайта или при переходе на https адреса в этом пути тоже нужно будет менять.

Что такое относительный путь к файлу?

С эти немного сложнее. Относительный путь к файлу указывается относительно расположения того файла в коде которого он указывается. Давайте разберём на конкретных примерах.

Пример 1.
Допустим, мы вставляем картинку в index.html, который лежит в папке с доменом. Там же в папке с доменом находится папка images с нашей картинкой.

Относительный путь будет выглядеть так:

Пример 2.
Нам нужно указать относительный путь к картинке в файле style.css, который лежит в папке CSS. При этом сама картинка находится не папке images.

В этом случае если мы просто напишем /images/image.png, как в предыдущем примере, то это не сработает!

Браузер будет воспринимать эту запись так: «Зайди в папку images, которая лежит рядом с файлом style.css и возьми там файл image.png». Проблема в том, что в рядом с style.css нет никакой папки images! Она находится на уровень выше.

В таком случае мы должны как бы сказать браузеру: «Сначала выйди из папки CSS, в которой лежит style.css в котором мы указываем наш абсолютный путь, а потом зайди в папку images и возьми там файл image.png»

На языке кода команда «выйди из папки» будет выглядеть так: ../

В итоге получим:

Пример 3.

Если нужная картинка лежит рядом с файлом, в коде которого вы пишете путь, то это будет выглядеть так:

Особенности относительного пути:

  • для того чтобы его указать нужно представлять структуру файлов сайта
  • указанные адреса будут работать только в пределах вашего сайта
  • при переходе на https или смене домена все адреса будут по прежнем работать и их не нужно менять.

Определение пути к файлу в WordPress и других CMS

При работе с движками для отображения определённых файлов на сайте вам нужно указывать пути к ним или в админке или коде темы или шаблона.

Если вы вносите правки в коде, то указывать относительный путь вы должны относительно файла index.php который лежит в папке с доменом.

Получается, что вы вносите правки в файле шаблона, но путь должны указывать как будто бы вы работаете с index.php в корне сайта. Такова особенность работы движков.

Если вы указываете адрес внутри скрипта или CSS файла, то путь указывается относительно этого файла.

Так же в WordPerss есть специальные функции, которые избавят вас от необходимости бродить по папкам и гадать какой адрес нужно указывать. Эти функции возвращают абсолютный путь к папке с темой. Их несколько, но я обычно использую вот эту:

Путь к файлу css

Интернет-магазин под ключ

/>Абсолютный и относительный путь к файлу />

Как Вы знаете, в качестве значения атрибута href тега необходимо указать путь к файлу, на который делается ссылка.

Или, например, значением атрибута src тега является путь к файлу с изображением, которое будет располагаться на странице.

Путь к файлу — это его адрес. Адрес может быть абсолютным и относительным.

Абсолютный адрес

Абсолютный адрес работает везде, где прописана ссылка — независимо от имени сайта и его расположения.

Например ссылка http://www.webpupil.ru является абсолютной и ведет на главную страницу этого сайта.

Ссылка http://www.webpupil.ru/articles.php также является абсолютной и указывает путь к странице сайта www.webpupil.ru , содержащей перечень статей — файлу articles.php .

Таким образом абсолютный адрес или путь — это полный путь к файлу, начинающийся с указания протокола http с двоеточием и двумя символами слэш « :// », затем указывают адрес сайта: в нашем случае — это www.webpupil.ru и через слэш « / » непосредственно имя файла — articles.php .

Если файл расположен не в корневом каталоге сайта ( Корневой каталог/папка — это каталог, который не является подкаталогом ни одного другого каталога), а скажем в папке folder (то есть расположен во вложенной папке), то для задания его полного адреса следует после имени сайта указать имя папки, а затем имя самого файла: http://www.webpupil.ru/folder/articles.php

Любую абсолютную ссылку (содержащую адрес сайта) можно разместить на любой странице любого сайта и она будет рабочей, то есть, кликнув по ней, пользователь обязательно перейдет по указанному в ней адресу.

Абсолютная адресация как правило используется для создания ссылок на другие сайты. Конечно такие ссылки можно использовать и внутри сайта, но подобное происходит редко, так как в основном абсолютные ссылки длинны и неудобны.

Относительный адрес

Для перехода между страницами внутри сайта используют относительные ссылки. Относительный путь к файлу указывают относительно текущего документа или относительно корневого каталога.
И здесь возможны варианты.

Приведем несколько примеров.

1 Вариант — файлы расположены в одной папке

Главная страница этого сайта — файл index.php и страница, содержащая перечень статей — файл articles.php находятся в корневом каталоге (в одной папке). Для создания ссылки с одной из этих страницы на другую, необходимо в качестве значения атрибута href тега указать имя файла, на который делается ссылка.

2 Вариант — ссылка на файл, расположенный во вложенной папке

Файл articles.php находится в корневом каталоге, а файл с изображением, которое необходимо вставить на страницу располагается в папке img корневого каталога (во вложенной папке — то есть в папка расположенной внутри другой. Условно назовем это первым уровнем вложенности).

Для указания пути к файлу с изображением необходимо сначала указать имя папки, в которой расположен нужный файл, а затем через слэш « / » непосредственно имя файла.

Относительный путь к файлу с изображением.

Относительный путь к файлу с изображением.

3 Вариант — ссылка из вложенной папки

Теперь наоборот: допустим текущий файл находится во вложенной папке, а файл index.php , на который делается ссылка, расположен в корневом каталоге. Тогда ссылка (из файла, расположенного во вложенной папке) на файл index.php будет иметь следующий вид:

То есть перед именем файла, на который делается ссылка из вложенного каталога, необходимо поставить две точки и слэш « ../ ».

И последний вариант.

Текущий документ имеет второй уровень вложенности, то есть он расположен в папке, которая уже является вложенной.

Тогда, чтобы сделать ссылку на файл, который расположен в корневом каталоге, необходимо добавить еще две точки и слэш « ../ ».

Таким образом относительные ссылки (или относительный адрес/путь к файлу) используют для организации ссылочной структуры между файлами, которые являются страницами одного сайта, а также файлами, содержащими изображения, фотографии и другие объекты, которые также непосредственно относятся к этому сайту.

То есть все файлы: и страницы, и различные объекты, вставляемые на эти страницы, расположены на разных уровнях вложенности, но в одном — корневом каталоге.

Если требуется сослаться на какую-либо страницу другого сайта или вставить какой-либо объект, расположенный на другом сайте, то здесь мы уже работаем с абсолютной адресацией.

Относительный путь

Относительный путь может указывать где находится файл в двух вариантах: относительно корневого каталога или относительно файла (иногда относительно программы которая работает в данный момент).

Путь относительно корневого каталога сайта http://mysite.com будет таким:

Такую запись нельзя использовать в браузере (т.к. там требуется указание сайта), но можно использовать в скриптах а также на html, php и подобных страницах. Она говорит серверу о том, что файл file.png находится в папке images, которая находится в корне сайта.

Путь относительно корневого каталога всегда начинается со знака «/», который означает, что это корень каталога и выше по директории мы подняться не сможем.

Путь относительно файла или каталога в котором находится работающая программаскрипт, может начинаться со знака «../»

Этот знак сообщает, что от исходного файла (или текущей директории программы) нужно подняться на 1 директорию вверх, найти там папку images, а в ней найти file.png.

А вот такая строка делает тоже самое, но только на 2 директории вверх от исходного файла (или текущей директории программы).

Еще один наглядный пример — у нас есть сайт (MySite), в нем есть папка Programm в которой находится файл index.php. Путь к картинке file.png относительно файла index.php будет такой:

Вместо файла index.php может быть файл программы, которая считает за корневую директорию именно ту, где сама программа находится (в нашем случае Programm). В таком случае относительный путь будет таким же (../images/Files/Images/file.png).

Чем относительный отличается от абсолютного пути?

Абсолютный путь показывает точное местонахождение файла, а относительный показывает путь к файлу относительно какой-либо «отправной точки» (файл, программа и т.д.).

Юзеры ( 1 ) оценили на 5.0 из 5

Настоятельно рекомендуем не покупать слишком дешевый хостинг! Как правило с ним очень много проблем: сервер иногда не работает, оборудование старое, поддержка долго отвечает или не может решить проблему, сайт хостера глючит, ошибки в регистрации, оплате и т.д.

Также мы собрали тарифы от тысяч хостеров, чтобы вы могли выбрать хостинг по конкретной цене.

Облачный хостинг — распределение нагрузки на несколько серверов, если сервер с вашим сайтом перегружен или не работает. Это гарантия того что пользователи в любом случае смогут видеть ваш сайт. Но это дорогая, более сложная опция, которую предоставляют далеко не все провайдеры.

Виртуальный хостинг — подходит для большинства проектов начального уровня с посещаемостью до 1000 человек в сутки. В таком хостинге мощность сервера делится между несколькими хостинговыми аккаунтами. Услуга проста в настройке даже для новичков.

VPS — подходит для более сложных проектов с достаточно большой нагрузкой и посещаемостью до 10000 человек в сутки. Здесь мощность сервера фиксированная для каждого виртуального сервера, при этом сложность настройки увеличивается.

Выделенный сервер — нужен для очень сложных и ресурсоемких проектов. Для вас выделяют отдельный сервер,мощность которого будете использовать только вы. Дорого и сложно настраивать.

Размещение и обслуживание вашего собственного сервера в дата-центре хостинга — это не очень популярная услуга и требуется в исключительных случаях.

CMS — это система управления контентом сайта. Хостеры стараются для каждой из них делать отдельный тариф или упрощать установку. Но в целом это больше маркетинговые ходы, т.к. у большинства популярных CMS нет специальных требований к хостингу, а те что есть — поддерживаются на большинстве серверов.

Тестовый период — предоставляется хостером бесплатно на 7-30 дней, чтобы вы могли удостовериться в его качестве.

Moneyback — период на протяжении которого хостер обязуется вернуть деньги, если вам не понравится хостинг.

Означает какая операционная система установлена на сервере хостинга. Мы рекомендуем размещать на серверах с Linux, если нет особых требований у разработчиков сайта.

Абузоустойчивый хостинг — компании, которые разрешают размещать практически любой контент, даже запрещенный (спам, варез, дорвеи, порнографические материалы). Такие компании не удаляют контент вашего веб-сайта при первой же жалобе (“абузе”).

Безлимитный хостинг — хостинг у которого отсутствуют лимиты на количество сайтов, БД и почтовых ящиков, трафик, дисковое пространство и т.д. Обычно это больше маркетинговый трюк, но можно найти что-то интересное для себя.

Безопасный хостинг — тот, где администрация постоянно обновляет ПО установленное на серверах, устанавливает базовую защиту от DDoS-атак, антивирус и файерволлы, блокирует взломанные сайты и помогает их «лечить».

Защита от DDOS — компании, которые предоставляют хостинг с защитой от DDoS-атак. Такие пакеты ощутимо дороже обычных, но они стоят своих денег, так как ваш сайт будет защищен от всех видов сетевых атак.

На языке программирования PHP и базах данных MySQL сейчас работает большинство сайтов. Они же поддерживаются практически всеми современными хостингами.

ASP.NET — платформа для разработки веб-приложений от Майкрософт.

От панели управления зависит ваше удобство в настройке хостингесайта.

Большинство качественных хостингов из нашего ТОПа используют удобные панели управления, поэтому рекомендуем больше внимания уделить другим параметрам при выборе.

Относительные и абсолютные пути в HTML и PHP

Относительные и абсолютные пути в HTML (веб-адреса)

Абсолютные пути

В данном случае всё очень просто, мы указываем прямой путь к файлу, лежащему на другом домене. Возможно указание сокращенного пути через использование двух слешей в начале без явного указания http или https и сервер сам подставит нужный протокол (расширение) согласно настройке сервера. Важно заметить, что данный вид является необходимым для перехода между сайтами:

Относительно корня сайта

В данном случае браузер берёт домен сайта и к нему подставляет указанную ссылку. В данном случае получится http://school-php.com/css/style.css. В случае с http, https не надо париться, так как будет браться в том виде, в котором сейчас открыта страница, то есть при http будет http. Так же очень удобно для переноса некого функционала между разными сайтами или же перенос сайта с одного домена на другой не трогая код. Приоритетный способ указания путей к страницам и файлам.

Относительно данной страницы

Менее востребованный способ, так как он берёт нынешнюю страницу и к её пути дописывает новый адрес. То есть находясь на странице http://school-php.com/trick ссылка на файл будет иметь вид: http://school-php.com/trick/css/style.css . Практически невозможен в использовании в случаях, когда мы используем ЧПУ.

Использование тега base

В данном случае вместо стандартной подставки домена к относительному пути будет подставлен путь из base. То есть мы получим файл, располагающийся:

Относительные и абсолютные пути в PHP

Всё очень просто, работая в файловой системе мы будем придерживаться правил работы с путями в PHP. Если же мы передаём команду в браузер клиента, то тут используются пути HTML. То есть в следующем примере у нас из PHP передаётся путь браузеру с страницей, на которую ему надо перейти. То, что переход между страницами браузер осуществил можно увидеть в адресной строке:

Итого, открываем страницу page1.php, а в адресной строке записано page2.php, а всё дело в том, что браузер СНАЧАЛА загрузил страницу page1.php, а потом получил информацию с переадресацией и ЗАГРУЗИЛ страницу вторую page2.php. В данном случае переадресация была на стороне клиента (браузера), а значит используем правила относящиеся к HTML (веб-адрес).

Абсолютный путь в PHP

Абсолютный путь в PHP воспринимается как абсолютный путь от директории, в которой установлен веб-сервер. Данный путь можно получить из:

Если взять в пример этот сервер, то его путь: /home/school/public_html/schoolphp , значит для того, чтобы указать полный путь к фотографии ‘/photo/img1.jpg’, необходимо указать такой путь:

Хочу заметить, что сайт может располагаться в поддиректории, то есть для:

может быть крайне затруднительно использование DOCUMENT_ROOT, ведь форум (как внешний скрипт) ещё не знает где будет размещаться на сайте. Справиться с данной проблемой можно несколькими способами, давайте парочку перечислим:

1) Создать в виде поддомена страницу.

2) Прописать абсолютный путь в конфиге в config.php , то есть:

Теперь можно без угрызения совести привязать весь сайт на Core::$ROOT, и если случайным образом необходимо поменять путь до подключаемого файла, то можно переопределить значение Core::$ROOT;

Относительно стартового файла (базового)

Во многих системах index.php есть единая точка входа, то есть открывается index.php, а уже из него подключаются другие файлы.

В данном случае будет подключен allpages.php по пути: /home/school/public_html/schoolphp/modules/allpages.php . Данный способ удобен тем, что если прописать include в файле allpages.php: include ‘./modules/module/page.php’;, то искать его будет всё равно относительно точки входа, а именно index.php:

Достаточно удобная реализация учесть, что мы чётко знаем структуру нашего приложения относительно корневого index.php. Даже если мы вызываем любой другой файл, а не index.php, то работать пути будут абсолютно точно так же. Вызвали мы dir.php , значит относительно файла dir.php и будут браться пути!

Что ещё надо знать

Я не мог не напомнить тем, кто забыл или же подсказать тем, кто не знает, что можно вернуться не только вглубь директорий, но и вверх (на папки назад), и синтаксис их достаточно прост:

В данном случае будет браться директория данного файла или корневого index.php, и возвращаться на 1 папку назад, там же будет искаться файл ‘file.php’.

DOCUMENT_ROOT не единственный вариант получить корневой путь сайта. Давайте взглянем в мануал: «Директория корня документов, в которой выполняется текущий скрипт, в точности та, которая указана в конфигурационном файле сервера.» . Это значит, что в случаях, если в конфигурационном файле будет некорректно написан путь, то весь сайт не будет работать. Что делать? Можно писать админам и владельцам хостинга, на котором размещается сервер с надеждой, что они исправят свои недочёты. Или искать стабильную альтернативу, которой является __DIR__ , это абсолютный путь к данному файлу, где запущен код файлу. Допустим файл конфигурации у нас лежит в папке config, и чтобы используя __DIR__ не возвращаться каждый раз на 1 папку наверх записью __DIR__’/../’ мы смело можем __DIR__ записать в свою переменную, примером ниже я записал в свойство класса (урок №24, кто не дошел используйте обычную переменную):

Так же хотелось напомнить кое-что интересное и важное. Согласно безопасности веб-сервер запрещает перемещение по директориям выше корня сайта. То есть сайт находится по следующему пути: /home/school/public_html/schoolphp , но прочитать содержание папок /home, или /home/school будет недоступно.

Может ли PHP пользоваться путями HTML ? Да, в специальных функциях, для примера:

Практика

В своих старых проектах я использовал DOCUMENT_ROOT, сейчас перешел на относительные index.php пути ‘./папка/файл’.

Zend2, продукт от разработчиков PHP, один из самых сложных FrameWork на данный момент использует так же относительные пути с отличным синтаксисом от моего, то есть ‘папка/файл’.

Абсолютные и относительные пути в PHP

Пути к файлам — тема, которая обычно взрывает мозг новичкам. Но не волнуйся, сейчас мы всё расставим по полочкам.

Чем отличаются пути в PHP и URL

Когда мы смотрим любимый фильм или сериал, мы видим только готовый продукт.

А за кадром существует совсем другой, невидимый для нас мир: стилисты и гримёры, искусственные декорации, наложение спецэффектов и многое другое.

В PHP существует такое же разделение. С одной стороны — реальная файловая система с реальными папками и файлами, с другой — URL адреса, которые могут не иметь ничего общего с реальной файловой структурой.

Если ты видишь на каком-нибудь сайте страницу с URL /category/monitors — это совсем не значит, что на сайте есть скрипт /category/monitors/index.php .

Вполне вероятно, что и такой папки там тоже нет, а все URL адреса обрабатываются одним единственным PHP файлом.

И даже если в URL присутствует расширение файла, например /about.html — это тоже не говорит о существовании файла about.html . Может он есть, а может и нет.

Новички часто путают пути к реальным файлам с URL адресами. Сейчас я разберу пару таких ошибок, на примере которых можно будет прочувствовать разницу.

Ошибка №1: Подстановка физического пути в URL

Очень частая ошибка новичков — пытаться подставить в URL адрес ссылку на физический файл, вроде такого:

Это неправильно. Браузер не может видеть реальную файловую структуру сервера. Он не видит никаких дисков D, он видит только URL адреса.

Правильная ссылка выглядит так (разницу объясню чуть позже):

Ошибка №2: Подключение скриптов по URL

Иногда новички пытаются подключить физический файл по его URL:

Это неправильно. Во-первых, подключится не сам скрипт, а результат его работы. Во-вторых, подключать какие-то файлы через URL вообще идея очень опасная.

Абсолютный путь в PHP

Абсолютный путь — это полный путь к папке или файлу. Вот пара примеров для разных операционных систем:

  • D:OpenServerdomainstest.ruindex.php — для OpenServer на Windows
  • /var/www/html/test.ru/index.php — для Ubuntu

Как видите, это полный путь от корня диска до конкретного файла или папки. Начинается со слеша или буквы диска (Windows).

Получить абсолютный путь скрипта можно с помощью магической константы __FILE__ :

Для получения абсолютного пути к папке, в которой находится скрипт, есть магическая константа __DIR__ :

Как этим пользоваться. Допустим, у нас в корне сайта лежат файлы index.php и config.php и мы хотим подключить второй в первый.

Если мы хотим подключить config.php по его абсолютному пути, есть два способа сделать это:

Поскольку константа __DIR__ не добавляет слеш после последней папки, мы указываем его вручную.

Относительный путь в PHP

У относительных путей в PHP есть один подвох — они могут строиться относительно не той папки, от которой мы ожидаем.

Дело в том, что когда мы подключаем скрипт по относительному пути require(‘config.php’); , PHP будет искать его по следующему алгоритму:

Сначала PHP попытается найти этот файл в папках, указанных в директиве include_path. Посмотреть, что указано в этой директиве конкретно у вас можно с помощью var_dump(get_include_path()); , папки разделяются символом ;

Если мы укажем путь к скрипту в таком виде: require(‘./config.php’); , то этот шаг будет пропущен.

Далее PHP попытается найти файл в папке текущего рабочего каталога.

Например, если мы в index.php подключили файл scripts/script.php, а в этом самом script.php уже пытаемся подключить файл по относительному пути, тогда поиск файла произойдёт и в папке scripts тоже.

Два последних пункта — главная проблема относительных путей. Мы не можем быть уверены, что будет подключен именно тот файл, который нам нужен.

Именно по этой причине я призываю тебя отказаться от использования относительных путей в PHP.

Кому-то из практикующих разработчиков эта фраза может не понравиться, но я считаю это единственным разумным решением.

Тем более нет ничего сложного в добавлении константы __DIR__ перед именем скрипта, что автоматически сделает путь абсолютным.

Абсолютный путь в URL

Абсолютный путь в URL означает путь от корня сайта. Корень сайта — это папка, которая содержит публичную часть сайта, т.е. доступную извне.

По-умолчанию корень сайта — это сама папка с сайтом, например site.ru , но зачастую её меняют на site.ru/public , чтобы часть скриптов нельзя было запустить по прямой ссылке в браузере.

Есть несколько способов указать абсолютный путь в URL:

  • http://test.ru/article.php — полный путь с протоколом и доменом
  • //test.ru/article.php — полный путь без протокола (берётся из текущей страницы). Содержит два слеша в начале.
  • /article.php — полный путь без протокола и домена (берутся из текущей страницы). Содержит слеш в начале.

Второй и третий варианты удобны тем, что при миграции с http на https и обратно все ссылки автоматически сменят протокол, не нужно будет бегать по всему сайту и менять вручную.

Лично я практически всегда использую третий вариант, кроме случаев, когда нужно указать ссылку на другой поддомен (blog.site.ru, shop.site.ru и т.д.).

Относительный путь в URL

Относительные пути в URL указываются без слеша в начале ссылки, например:

Относительные пути в URL более предсказуемы, чем в PHP. Но я рекомендую использовать их только там, где это действительно необходимо.

Чаще всего их использование приводит к путанице. И вот пара типичных проблем, с которыми часто сталкиваются новички.

Ошибка №1: относительные пути к стилям, скриптам и другим файлам

Представим, что мы решили подключить стили к нашему сайту:

Разработчик указывает относительный URL style.css и видит, что всё работает. По крайней мере, на главной странице.

Но при переходе по любой ссылке, например /products/15 , стили перестают работать.

А причина в том, что относительный путь строится от текущего URL-адреса, а значит в нашем примере он из style.css превратился в /products/15/style.css .

Ошибка №2: Рекурсия в ссылках

При использовании относительных путей есть риск случайно создать на сайте бесконечные ссылки. Вот один из таких способов:

Для работы данного кода должна быть настроена единая точка входа.

Проблема в том, что при каждом клике по этой ссылке текущий URL будет не перезаписываться, а дополняться, в итоге через несколько кликов мы получим что-то вроде http://test.ru/articles/articles/articles/articles/about .

Текущий и родительский каталоги

Помимо указания конкретных папок, мы также можем добавить в путь указание «перейти на папку выше», например:

В коде выше мы подключим файл config.php, который находится не в текущей папке, а в родительской. С абсолютными путями это тоже работает:

И с URL-адресами тоже:

Также мы можем указать ссылку на текущий каталог, что бывает актуально в некоторых операционных системах:

Путь к файлу css

Безымянный.png

Вы можете опубликовать сообщение сейчас, а зарегистрироваться позже. Если у вас есть аккаунт, войдите в него для написания от своего имени.
Примечание: вашему сообщению потребуется утверждение модератора, прежде чем оно станет доступным.

Похожие публикации

Ребята, без вас никуда!
Подскажите, пожалуйста, первый раз адаптирую и стилизую слайдер splide.
Сам он работает, но как его стилизовать? В dev tools стилизация тех же стрелок отражается, но когда вношу их в css — не работает. Почему так? Как, например, тогда опустить ниже стрелки? Где устанавливать брейкпоинты и задавать им свойства?

HTML Путь к файлу

Путь к файлу описывает расположение файла в структуре папок веб сайта.

Примеры пути к файлам

Путь Описание
<img src="picture.jpg"> picture.jpg находится в той же папке, что и текущая страница
<img src="images/picture.jpg"> picture.jpg находится в папке images в текущей папке
<img src="/images/picture.jpg"> picture.jpg находится в папке images в корне текущего веб-сайта
<img src="../picture.jpg"> picture.jpg находится в папке на один уровень выше текущей папки

Пути к HTML файлам

Путь к файлу описывает расположение файла в структуре папок вебсайта.

Пути к файлам используются при связывании с внешними файлами, например:

  • Веб-страницы
  • Изображения
  • Таблицы стилей
  • JavaScripts

Абсолютные пути к файлам

Абсолютный путь к файлу — это полный URL адрес файла:

Пример

Теги <img> и атрибуты src и alt описаны в главе HTML Изображения.

Относительные пути к файлам

Относительный путь к файлу указывает на файл относительно текущей страницы.

В этом примере путь к файлу указывает на файл в папке images, расположенной в корне текущего веб-сайт:

Пример

В этом примере путь к файлу указывает на файл в папке images находятся в текущей папке:

Пример

В этом примере путь к файлу указывает на файл в папке images находятся в папке на один уровень выше текущей папки:

Пример

Практика лучше всего

Рекомендуется использовать относительные пути к файлам (если возможно).

При использовании относительных путей к файлам, веб-страницы не будут привязаны к вашему текущему базовому URL-адрес. Все ссылки будут работать на вашем собственном компьютере (localhost), а также на вашем текущем общественном домене и вашем будущем публичном домене.

Упражнения
Тесты
КАК СДЕЛАТЬ
ПОДЕЛИТЬСЯ
СЕРТИФИКАТЫ

Сообщить об ошибке

Если вы хотите сообщить об ошибке или сделать предложение, не стесняйтесь, присылайте нам электронное письмо:

Ваше предложение:

Спасибо, за вашу помощь!

Ваше сообщение было отправлено в SchoolsW3.

Топ Учебники
Топ Справочники
Топ Примеры
Веб Сертификаты

SchoolsW3 оптимизирован для обучения, тестирования и тренировки. Примеры упрощают и улучшают чтение и базовое понимание. Учебники, справочники, примеры постоянно пересматриваются, для того, чтобы избежать ошибки, невозможно гарантировать правильность всего содержимого. Используя данный сайт, вы соглашаетесь прочитать и принять условия использования, cookie и Политика конфиденциальности. Авторское право 1999 — 2021 Все права защищены.
Работает на W3.CSS.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *