有相对于 root 的链接吗?

有没有办法让页面上的所有链接都是相对于根目录的?

例如,在 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?如果是第一个,有没有办法让它指向第二个?

365729 次浏览

使用

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

或者

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

根相对 URL 以 /字符开头,看起来类似于 <a href="/directoryInRoot/fileName.html">link text</a>

您发布的链接: <a href="fruits/index.html">Back to Fruits List</a>链接到一个名为 fruits的目录中的 html 文件,该目录与此链接出现的 html 页面位于同一目录中。

要使其成为根相对 URL,请将其更改为:

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

编辑 在回答问题时,在评论中,来自 OP:

所以做/将使它相对于 www.example.com,有没有一种方法来指定根是什么,例如,如果我希望根是 www.example.com/fruits www.example.com/fruits/apples/apple.html 的呢?

是的,在 URL 的 hrefsrc属性前面加上 /将使路径相对于根目录。例如,给定 www.example.com/fruits/apples.html的 html 页面,href="/vegetables/carrots.html"a将链接到页面 www.example.com/vegetables/carrots.html

base标签元素允许您为该页面指定 base-uri (尽管 base标记必须添加到 每个页面,在 每个页面中使用特定的 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 的示例。

建议阅读:

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

如果你从 ASP.NET 应用程序服务器端创建网址,并将你的网站部署到你网站的 虚拟目录(例如 app2) ,即。 Http://www.yourwebsite.com/app2/

然后插入

<base href="~/" />

就在标题标签后面。

因此,无论何时使用根相对。

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

将决定“ http://www.yourwebsite.com/app2/Accounts/Login

这样你总是可以相对地指向你的文件——绝对地;)

对我来说,这是最灵活的解决方案。

为一个图像标记提供一个 URL,该图像标记位于根目录中,如

`logo.png`

你应以 /开始输入 src的网址如下:

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

这个代码工程在任何目录没有任何麻烦,即使你是在 branches/europe/about.php仍然可以看到的标志就在那里。

在服务器上使用这个代码“ ./”作为 root 用户,因为它对我有用

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

但是当您在本地机器上时,使用以下代码“ . ./”作为根相对路径

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

相对路径摘要(适用于 Href Src等) :

/file_Or_FolderName          Root directory
./file_Or_FolderName         Current directory
../file_Or_FolderName        Previous directory (One level up)
../../file_Or_FolderName     Previous of previous directory (Two levels up)
../../../file_Or_FolderName  Just like above - Three levels up

例如:

www.example.com
├── apple.html
└── FolderA
├── fileA.html
└── FolderB
├── fileB.html
└── FolderC
├── fileC.html
└── FolderD       <------ Suppose you're here (current directory)
├── fileD.html
└── FolderE
└── fileE.html

下面展示了如何使用相对路径(适用于 href、 src 等)访问 不同层次处的文件

fileD.html                 - same level access(or)
./fileD.html               - same level
./FolderE/fileE.html       - 1 level Down
../fileC.html              - 1 level Up
../../fileB.html           - 2 levels Up
../../../fileA.html        - 3 levels Up
../../../../apple.html     - 4 levels Up (or)
/apple.html                - 4 levels Up but direcly using root /