使用 <a> 标签导航 - href 值

Question

我是网络开发和设计的新手，我的问题如下：

当我使用以下目录结构创建自己的页面时：

projectName [dir]
    |
    +-- public_html [dir]
            |
            +-- index.html  <-- main web page file
            +-- AnimationSrc [dir]
                    |
                    +-- animation1.html
                    +-- animation2.html
                    (...)

从 index.html 到 animation1.html 的导航是使用标签完成的：

<li><a href="./AnimationsSrc/animation1.html" target="_self">Animation1</a></li>

只有这种 href 的构造在末尾带有前导点和直接 html 文件才能给我正确的结果，这意味着在选择 link 之后，我从以下位置导航：

http://localhost:8383/ProjectName/index.html

收件人：

http://localhost:8383/ProjectName/AnimationsSrc/animation1.html

如果我删除前导点，我得到的是：

http://localhost:8383/AnimationsSrc/animation1.html

此外，当我删除直接文件名时，页面也不会呈现。

但是当我使用 firebug/any 其他浏览器工具浏览其他网站时，我经常看到这样的结构：

来自 Bower.io:

<a href="/search">Search packages</a>

没有前导点且路径未指向特定 html 文件

来自Netbeans.org：

<a title="NetBeans&nbsp;IDE" href="/features/index.html">NetBeans IDE</a>

没有前导点。

谁能解释一下，有什么区别？为什么我被迫把那个前导点和直接 link 到 html 文件，而例如Netbeas 在没有前导点的情况下做同样的事情，而 bower 只在目录中做？这与底层后端技术有关吗？一些脚本？

提前感谢您的帮助

Answer 1

区别是

<a href="http://www.example.com/example.css">是绝对的URL，表示指向另一个网站。 <a href="/search"> 是亲戚 URL，它表示指向网站中的文件。

您可以在这里了解 ./ 和 / 的区别：http://www.dirigodev.com/blog/seo-web-best-practices/relative-vs-absolute-urls-seo/

Answer 2

/表示当前驱动器的根目录。

./表示当前目录。

当您删除 .然后 / 在前面将导航到根目录，并在根目录中搜索 AnimationsSrc 文件夹。

最佳做法是不使用 / 即。 href="AnimationsSrc/animation1.html"

使用 <a> 标签导航 - href 值

Navigation with <a> tag - href value

html

href