Имеете ссылки относительно root? - PullRequest
146 голосов
/ 06 апреля 2011

Можно ли сделать так, чтобы все ссылки на странице относились к корневому каталогу?

Например, на www.example.com/fruits/apples/apple.html у меня может быть ссылка:

<a href="fruits/index.html">Back to Fruits List</a>

Будет ли эта ссылка указывать на www.example.com/fruits/apples/fruits/index.html или www.example.com/fruits/index.html?Если первое, есть ли способ, чтобы оно указывало на второе вместо?

Ответы [ 7 ]

262 голосов
/ 06 апреля 2011

Корневой URL начинается с символа / и выглядит примерно так: <a href="/directoryInRoot/fileName.html">link text</a>.

Ссылка, которую вы разместили: <a href="fruits/index.html">Back to Fruits List</a> - это ссылка на html-файл, расположенный в каталоге с именем fruits, причем каталог находится в том же каталоге, что и html-страница, на которой появляется эта ссылка.

Чтобы сделать его относительным корневым URL, измените его на:

<a href="/fruits/index.html">Back to Fruits List</a>

Отредактировано в ответ на вопрос, в комментариях от ОП:

Таким образом, если вы сделаете / сделаете это относительно www.example.com, есть ли способ указать, что такое корень, например, что если я хочу, чтобы корнем был www.example.com/fruits в www.example.com? /fruits/apples/apple.html?

Да, перед URL-адресом в атрибутах href или src с помощью / будет указан путь относительно корневого каталога. Например, с учетом html-страницы на www.example.com/fruits/apples.html, a из href="/vegetables/carrots.html" будет ссылаться на страницу www.example.com/vegetables/carrots.html.

Элемент base tag позволяет вам указать base-uri для этой страницы (хотя тег base должен быть добавлен к каждой странице , на которой он было необходимо для использования конкретной базы, для этого я просто приведу пример W3:

Например, с учетом следующей декларации BASE и декларации A:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
 <HEAD>
   <TITLE>Our Products</TITLE>
   <BASE href="http://www.aviary.com/products/intro.html">
 </HEAD>

 <BODY>
   <P>Have you seen our <A href="../cages/birds.gif">Bird Cages</A>?
 </BODY>
</HTML>

относительный URI "../cages/birds.gif" будет разрешаться в:

http://www.aviary.com/cages/birds.gif

Пример цитируется с: http://www.w3.org/TR/html401/struct/links.html#h-12.4.

Рекомендуемое чтение:

18 голосов
/ 06 апреля 2011

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

<a href="/fruits/index.html">Back to Fruits List</a>

или

<a href="../index.html">Back to Fruits List</a>
4 голосов
/ 08 августа 2013

просто поставьте <a href="/">some link<a/>, и вы попадете в корень сайта

3 голосов
/ 10 октября 2014

Если вы создаете URL-адрес со стороны сервера приложения ASP.NET и развертываете свой веб-сайт в виртуальном каталоге (например, app2)на вашем веб-сайте, например, http://www.yourwebsite.com/app2/

, затем просто вставьте

<base href="~/" />

сразу после тега заголовка.

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

<a href="/Accounts/Login"/> 

разрешит "http://www.yourwebsite.com/app2/Accounts/Login"

. Таким образом, вы всегда можете указывать на свои файлы относительно-абсолютно;)

Для меня это наиболее гибкое решение.

3 голосов
/ 06 апреля 2011
<a href="/fruits/index.html">Back to Fruits List</a>
0 голосов
/ 29 августа 2017

Используйте этот код "./" как root на сервере, так как он работает для меня

<a href="./fruits/index.html">Back to Fruits List</a>

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

<a href="../fruits/index.html">Back to Fruits List</a>
0 голосов
/ 12 января 2017

Чтобы дать URL тегу изображения, который находит каталог images/ в корне, например

`logo.png`

Вы должны указать src URL, начинающийся с /, следующим образом:

<img src="/images/logo.png"/>

Этот код работает в любых каталогах без каких-либо проблем, даже если вы находитесь в branches/europe/about.php, но логотип можно увидеть прямо здесь.

...