5-HTML链接

文章目录

• • HTML 超链接（链接）
  • HTML 空链接
  • HTML 链接 - target 属性
  • HTML 链接 - id 属性

HTML 超链接（链接）

HTML使用标签 <a>设置超文本链接，是可以从一个页面指向另一个目的端的链接。

当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。

在标签<a> 中使用了href 属性来描述链接的地址。

链接的形式如下：

<a href='链接地址'>显示文字</a>

效果：

显示文字

默认情况下，链接将用以下形式出现在浏览器中：

• 一个未访问过的链接显示为蓝色字体并带有下划线
• 访问过的链接显示为紫色并带上下划线
• 点击链接时，链接显示为红色并带上下划线

另外，如果为这些超链接设置了CSS样式，展示样式会根据CSS的设定来显示

HTML 空链接

HTML 空链接：指指向链接后，鼠标变成手形，但单击后仍停留在当前页面。

临时加的空链接，主要为了能更好的看到最终的效果。

基本语法：

<a href="#">显示文字</a>

其中“ # ”表示空链接。例如：

<a href="#">HTML学习</a>

效果：

HTML学习

HTML 链接 - target 属性

使用 Target 属性，可以定义被链接的文档在何处显示（在新的窗口打开，还是在原有的窗口中打开）。

下面的这行会在新窗口打开文档：

<a href="//www.baidu.com/" target="_blank">百度</a>

百度

默认的被链接文档会在原有的窗口中打开的。如果将 target 属性设置为 “_blank” 则文档就会在新窗口打开。

HTML 链接 - id 属性

id 属性可用于在一个 HTML 文档中创建书签标记。

注意：书签是不以任何特殊的方式显示，在HTML文档中是不显示的，所以对于读者来说是隐藏的。

例如：

在HTML文档中插入ID:

<a id="tips">link</a>

这样就可以在HTML文档其他位置中创建一个链接到"link(id=“tips”）"：

<a href="#tips">link</a>

或者，从另一个页面创建一个链接到"link(即id=“tips”）部分"：

<a href="//www.baidu.com/#tips"> link </a>

注意事项： 请始终将正斜杠添加到链接末尾。假如这样书写链接：

href="//www.w3cschool.cn/html"

就会向服务器产生两次 HTTP 请求，这是因为服务器会在地址末尾添加正斜杠，然后创建一个新的请求，就像这样：

href="//www.w3cschool.cn/html/"