Относительный путь html – Что такое URL адреса, чем отличаются абсолютные и относительные ссылки для сайта

Адреса в HTML — Как создать сайт

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

Адреса в HTML могут указывать путь: на сайт, страницу сайта или файл расположенный на сайте. Обычно адрес HTML выступает в качестве значений у атрибутов, тега a (ссылки) или img (изображения):

<a href=»http://имяСайта»> — адрес сайта,
<a href=»http://имяСайта/stranitsa.html»> — адрес страницы сайта,
<img src=»http://имяСайта/file.jpg»> — адрес файла изображения расположеного на сайте.

Где в качестве имяСайта, выступает название сайта, например gabdrahimov.ru

Адреса в языке HTML бывают трёх видов:
1. Адрес сайта,
2. Абсолютный адрес (абсолютный путь к странице или файлу),
3. Относительный адрес (относительный путь к странице или файлу).

Адрес сайта

Адрес сайта в HTML это просто имя сайта c приставкой http://, например:

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

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

Примеры абсолютных адресов (абсолютных путей):

• <a href=»http://имяСайта/about.html»> — абсолютный адрес страницы about.html, сайта имяСайта
• <a href=»http://имяСайта/service/online.html»> — абсолютный адрес страницы online.html, находящейся в папке service, сайта имяСайта
• <a href=»http://имяСайта/product/soft/editor.html»> — абсолютный адрес страницы editor.html, находящейся в папке soft, сама папка soft находится в папке product, сайта имяСайта

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

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

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

Допустим в папке product находится страница list.html, её абсолютный адрес выглядит следующим образом:
http://имяСайта/product/list.html — страница list.html расположена в папке product

Есть еще одна страница, чей абсолютный адрес выглядит следующим образом:
http://имяСайта/about.html — страница about.html находится в корне (на одном уровне с главным файлом index.html) сайта.

На странице list.html нужно поставить ссылку, которая будет ссылаться на страницу about.html находящуюся на том же сайте. Сослаться на неё можно двумя способами:
1. <a href=»http://имяСайта/about.html»> — используя абсолютный путь,
2. <a href=»../about.html»> — используя относительный путь.

Символ ../

Если страница list.html тоже будет находится в корне сайта:
http://имяСайта/list.html, то для того чтобы сослаться на страницу about.html, нужно будет в HTML-документе list.html прописать следующий код:
<a href=»about.html»> — относительный путь.

Далее, если страница list.html будет находится в папке soft:
http://имСайта/product/soft/list.html, то для того чтобы сослаться на страницу about.html, нужно будет в HTML-документ файла list.html прописать следующий код:
<a href=»../../about.html»> — т.е. два раза подняться вверх по папкам.

Чтобы сослаться на страницу online.html, которая находится по адресу:
http://имяСайта/service/online.html, нужно в HTML-документе файла list.html, который находится по адресу:
http://имяСайта/product/soft/list.html

Точкой отсчета относительного адреса является то место, где находится ссылающаяся страница.

Также, в качестве точки отсчета относительного адреса может выступать корень сайта /, пример:
<a href=»/about.html»>
<a href=»/service/online.html»>

Разница между абсолютным и относительным путями

Рассмотрим различия между абсолютным и относительным путями:

1. Точка отсчета абсолютного адреса начинается с адреса сайта, точка отсчета относительного адреса начинается с места где находится страница, которая хочет сослаться на другую страницу или файл.
2. Абсолютный путь чётко задан и никогда не меняется, относительный путь может изменяться в зависимости от того, где находится ссылающаяся страница.
3. Абсолютные пути можно ставить на страницы и файлы разных сайтов, относительный путь можно использовать только в пределах одного сайта.

Читать далее: Цвет в HTML

Дата публикации поста: 5 февраля 2016

Дата обновления поста: 16 октября 2014

Навигация по записям

Относительные пути в html url. Абсолютный и относительный путь к файлам

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

В примере 8.2 показано создание абсолютной ссылки на другой сайт.

Пример 8.2. Использование абсолютных ссылок

Изучение HTML

При указании в качестве ссылки каталога сайта (например, http://сайт/css/), отображается индексный файл . Это файл, который загружается по умолчанию при обращении к каталогу без явного указания имени файла. Обычно в качестве индексного файла выступает документ с именем index.html .

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

Ссылки относительно текущего документа

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

1. Файлы располагаются в одной папке (рис. 8.4).

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

2. Файлы размещаются в разных папках (рис. 8.5).

Когда исходный документ хранится в одной папке, а ссылаемый в корне сайта, то перед именем файла в адресе ссылки следует поставить две точки и слэш (/), как показано ниже.

Две точки в данном случае означают выйти из текущей папки на уровень выше.

3. Файлы размещаются в разных папках (рис. 8.6).

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

Ссылка

Аналогично обстоит дело с любым числом вложенных папок.

4. Файлы размещаются в разных папках (рис. 8.7).

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

Ссылка

Заметьте, что никаких дополнительных точек и слэшей перед именем папки нет. Если файл находится внутри не одной, а двух папок, то путь к нему записывается так.

Ссылка

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

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

Учтите, что такая форма записи не работает на локальном компьютере, а только под управлением веб-сервера.

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

пути

Путь (Path)

Путь – это разделенное символами обратной косой черты имя директории или файла. Директория – это тоже самое, что и папка в проводнике Windows.

E:\Data\MyStuff (path terminating in a directory name) E:\Data\MyStuff\roads.shp (path terminating in a file name)

путь

Вы можете столкнуться с двумя написаниями пути: «pathname» и «path name». Все варианты написания пути (Path, pathname и path name) являются синонимами.

Системный путь и путь каталога

ArcGIS оперирует термином «путь каталога» или «путь ArcCatalog». Путь каталога – это путь, распознаваемый только ArcGIS. Например:

D:\Data\Final\Infrastructure.gdb\EastValley\powerlines

относится к классу пространственных объектов powerlines в наборе объектов EastValley файловой базы геоданных Infrastructure . Этот путь не является корректным системным путем с точки зрения операционной системы, поскольку Windows не распознает наборы и классы пространственных данных, расположенные внутри файловой базы геоданных. Само собой, ArcGIS работает с путями каталога.

Рабочая область и базовое имя

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

Местоположение

Местоположение (Location) является общим термином (см., например: «Укажите местоположение ваших данных» или «Введите местоположение ваших данных»).

Прямые и обратные косые черты

В Windows обратная косая черта (\ ) используется в качестве разделителя при указании пути. UNIX системы используют прямую косую черту (/ ). В ArcGIS не имеет значения, какая косая черта используется при указании пути. ArcGIS всегда будет правильно считывать путь, какой бы знак в нем не использовался.

Обратная косая черта при написании скрипта

Языки программирования, уходящие корнями в UNIX и язык C, такие как Python, рассматривают обратную косую черту (\ ) в качестве управляющего символа. К примеру, \n соответствует возврату каретки. Поскольку пути могут содержать обратные косые черты, необходимо избегать их распознавания как знак перехода. Обычным делом является использование двойной обратной косой черты, например:

thePath = «E: \\ data \\ telluride \\ newdata.gdb \\ slopes»

Другой вариант преобразования путей в строки Python с помощью директивы r показан ниже. Благодаря этому Python будет игнорировать обратные косые черты.

thePath = r»E:\data\telluride\newdata.gdb\slopes»

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

Абсолютный, или полный путь

Абсолютный (или полный) путь начинается с буквы диска, за которой следует двоеточие, например, D: .

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

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

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

Во время работы HTML страницы часто приходится загружать различные файлы. Это ссылки на другие страницы, изображения, файлы стилей и другие. Чтобы файлы могли загрузиться, в коде страницы нужно указывать не только имя файла, но и его адрес. Существуют абсолютный и относительный путь к файлу. Рассмотрим их подробно.

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

Абсолютный путь к файлу — это URL-адрес, например http://www.yandex.ru. Абсолютный адрес обычно используется для перехода на другой сайт. Внутри одного сайта тоже можно использовать абсолютный путь к файлу, но так редко делают, потому что это неудобно. Абсолютный адрес можно указать не только для главной страницы сайта, но и для любой доступной страницы. Узнать адрес любой страницы очень просто, он отображается в адресной строке браузера. Если Вам нужно указать адрес страницы, то нужно открыть страницу в браузере и скопировать её адрес из адресной строки.

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

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

Самый простой вариант — это когда текущий и ссылаемый файлы находятся в одной папке. В этом случае нужно указывать только имя файла. Например ссылка на страницу page.html выглядит так:

+

<a href="page.html">Ссылка</a>

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

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

Например, текущая страница находится в какой-то папке. Внутри этой папки есть папка myimages, а в ней картинка image.jpg, которую нужно добавить на страницу. Делается это так:

<img src="myimages/image.jpg" alt="Картинка">

Может быть несколько уровней вложенности. В этом случае папки перечисляются через слеш от самой внешней до самой внутренней, а затем ставится имя файла. Например, в папке myimages находится папка newimages, а в ней уже находится картинка. Тогда картинка добавляется так:

<img src="myimages/newimages/image.jpg" alt="Картинка">

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

Например, есть две папки, внешняя и внутренняя. Во внутренней находится наша страница, а во внешней находится страница page.html, на которую нужно сделать ссылку.

<a href="../page.html">Ссылка</a>

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

<a href="../../page.html">Ссылка</a>

Есть ещё один способ указания относительного пути к файлу — это путь относительно корня сайта, то есть самой внейшней папки сайта. В этом случае не имеет значения, где находится текущая страница. При таком способе сначала ставится слеш, а затем путь к файлу. Такой способ работает только на сервере. Для обычной папки на компьютере он работать не будет.

Например, если файл page.html находится в корне сайта, то независимо от расположения текущей страницы, ссылка на него выглядит так:

<p><a href="/page.html">Ссылка</a></p>

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

<p><a href="/dir/page.html">Ссылка</a></p>

Относительный путь в HTML — CodeRoad

Вы говорите, что ваш сайт находится в http://localhost/mywebsite , и давайте предположим, что ваше изображение находится внутри подпапки с именем pictures/ :

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

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

"/mywebsite/pictures/picture.png"

И это было бы то же самое, что:

"http://localhost/mywebsite/pictures/picture.png"

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

Относительный путь всегда находится относительно корня документа , поэтому, если ваш html находится на том же уровне каталога, вам нужно будет начать путь непосредственно с имени каталога Вашего изображения:

"pictures/picture.png"

Но есть и другие льготы с относительными путями:

точка-Слэш ( ./ )

Точка ( . ) указывает на тот же каталог, а косая черта ( / ) дает доступ к нему:

Так вот это:

"pictures/picture.png"

Было бы то же самое, что и сейчас:

"./pictures/picture.png"

Double-dot-slash ( ../ )

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

"../picture.png"

Вы можете играть с ними столько, сколько захотите, небольшой пример будет такой:

Допустим, вы находитесь в каталоге A и хотите получить доступ к каталогу X .

- root
   |- a
      |- A
   |- b
   |- x
      |- X

Ваш URL будет выглядеть так же:

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

"/x/X/picture.png"

Или:

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

"./../x/X/picture.png"

HTML. Как указать путь к файлу | Жизнь — это движение! А тестирование

Путь может быть абсолютный и относительный.

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

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

/absolute_path_lvl_1/level_2.1/level_3.1/Kevin.png 

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

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

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

1. Самый простой пример относительного пути — это просто имя файла. если файл лежит рядом, просто указываем его имя

Hello.png

Относительный путь, файл рядом

../Kevin_lvl_2.png

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

../level_2.1/level_3.1/Kevin.png

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

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

Если в начале пути корень не указать, то этот путь будет относительным, и он достраивается от текущего положения. В реальной жизни это напоминает дорогу к винному магазину — «два квартала налево и там все время прямо». Дойти по такому пути можно только из конкретной точки. Из другой ты попадешь уже в совсем другое место.

Отличия сперты отсюда.

В файле absolute_path_lvl_1 / level_2.2 / Diff_paths.html можно посмотреть пример HTML страницы с разными путями к файлам.

Вот пример абсолютного и относительного пути для одного и того же файла с Кевином.

<!— Абсолютный путь —>
<img src=»D:/hgprojects/html-and-css-learn/absolute_path_lvl_1/level_2.1/level_3.1/Kevin.png»>

D:/hgprojects → сюда у меня выкачан проект «html-and-css-learn». У вас может быть другой путь

<!— Относительный путь к тому же файлу —>
<img src=»../level_2.1/level_3.1/Kevin.png»>

PS — подробнее в книге «Изучаем HTML, XHTML и CSS» Эрика и Элизабет Фримен:

• относительный путь — стр 98
• абсолютных путях — стр 164