HTML 链接 - Html

HTML 链接（Hyperlinks）是在网页上定位到其他网页、文件、位置等的超链接。点击链接可以跳转到链接指向的位置。

基本语法

HTML 链接可以通过以下标签创建：

<a href="URL">Link text</a>

其中，href 属性定义链接目标，URL 可以是绝对路径或相对路径；Link text 定义链接文本。

例如，创建一个链接到 Google 的链接：

<a href="https://www.google.com/">Go to Google</a>

相对路径

相对路径是指链接目标与当前文档所在的路径之间的相对关系，可以使用相对路径来链接到同一网站内的其他页面。

链接到同一目录下的文件

例如，链接到同一目录下的 about.html 文件：

<a href="about.html">About us</a>

链接到父目录下的文件

如果需要链接到位于当前文档的父目录下的文件，可以使用 ../ 操作符来表示上一级目录，例如：

<a href="../index.html">Home</a>

链接到子目录下的文件

如果需要链接到位于当前文档的子目录下的文件，可以在路径中添加子目录的名称，例如：

<a href="blog/post.html">Read blog post</a>

锚点

在同一文件内创建本文内的链接时，可以使用锚点。通过在链接中添加 # 符号和锚点名称，可以链接到同一文档内的其他位置。

例如，在以下 HTML 片段中：

<h2 id="section1">Section 1</h2>
<p>This is the section 1.</p>
<h2 id="section2">Section 2</h2>
<p>This is the section 2.</p>

要创建到 Section 1 的链接，可以使用以下代码：

<a href="#section1">Go to section 1</a>

目标

在 HTML 链接中，可以指定链接目标，从而在新窗口中打开链接。

例如，要在新窗口中打开链接：

<a href="https://www.google.com/" target="_blank">Go to Google</a>

绝对路径 VS 相对路径

绝对路径和相对路径的主要区别在于，绝对路径是从根目录开始的完整路径，而相对路径是从当前文档所在路径开始到目标路径的路径。

绝对路径的优点是在任何情况下都能定位到目标文件，但相对路径更加灵活、简洁，易于处理同一网站内的链接。

总结

HTML 链接是在网页上实现超链接的重要组成部分，掌握 HTML 链接的基本语法和各种应用场景，对网页制作和优化都有着重要的意义。