HTML—a链接标签

一.a 标签 (Anchor ) : 超链接（锚）

行内元素

在页面中起到跳转或定位的作用（超链接、锚链接、a链接、a标签）

二.a标签的跳转功能

作用: 可以从一个页面跳转到另一个页面，设置超链接
代码:

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

效果：

链接未点击的时候，默认显示蓝色
链接点击过以后，显示为紫色（因为浏览器有默认的缓存机制，只要访问过一次的链接，默认都会展示成紫色，只有清除浏览器的缓存，才会变蓝）

注意：

在 a 标签之内必须写上内容, 如果没有内容, 页面上会看不到
a 标签不能嵌套（如果有两个a标签嵌套，那么点击的时候去哪里呢？）

三.a 标签的属性

href

a 标签有一个至关重要的属性：href，如果没有设置这个属性，他就会和最普通的行内元素一样 span 一样，没有特殊的功能。

<a href="https://bilibili.com">网址直接跳转</a> 
<a href="images/1.webp">相对路径跳转</a>
<a href="hello.exe">如果是打不开的文件，则下载之</a>
<a href="">空链接是刷新</a>
<a href="#">#是回到顶部</a>
<a href="javascript:;">禁止链接跳转</a>

target

a 标签最主要的功能是页面跳转，跳转的目标页面可以在当前窗口打开，也可以在新窗口打开，新窗口这个功能可以由 target 属性控制：
```
<a href="https://bilibili.com" tatget="_blank">新窗口打开网页</a> 
<a href="https://bilibili.com" tatget="_self">当前窗口打开网页</a>
```
- 【注意】属性值前面有一个下划线。

几个通用属性

title	鼠标悬停时的提示信息
class	定义名称
id	创建一个 HTML 文档书签（对于读者来说是隐藏的）
style	定义了HTML文档的样式文件引用地址

id 属性

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

提示: 书签不会以任何特殊方式显示，即在 HTML 页面中是不显示的，所以对于读者来说是隐藏的。

实例：

在HTML文档中插入ID:
<a id="tips">有用的提示部分</a>

在HTML文档中创建一个链接到"有用的提示部分(id="tips"）"：
<a href="#tips">访问有用的提示部分</a>

或者，从另一个页面创建一个链接到"有用的提示部分(id="tips"）"：
<a href="https://www.runoob.com/html/html-links.html#tips">
访问有用的提示部分</a>

四.创建假链接

<a href="#">页面二</a>
<a href="javascript:;">页面三</a>
<!-- 创建锚点链接
    跳转到页面中指定的位置
    步骤：
        1 给要跳转到的目标位置设置一个独一无二的id名
        2 将这个id名设置给a标签href属性 
        
<div id="aqua-box" style="height: 450px;background-color: aqua;"></div>
<div id="azure-box" style="height: 450px;background-color:azure;"></div>
<div id="brown-box" style="height: 450px;background-color:brown;"></div>

<a href="#aqua-box">来蓝色</a>
<a href="#azure-box">来黄色</a>
<a href="#brown-box">来红色</a>

a标签空链接href=#与href=javascript:的区别

这两种写法有如下几个区别：

# 包含了一个位置信息，默认的锚是 #top 也就是网页的上端。即是说，当 href=# 的空链接被点击时，页面会跳到最顶端。
而 javascript:void(0) 仅仅表示一个死链接，当 href=javascript:void(0) 的空链接被点击时，页面不会有任何反应。
在页面很长的时候会使用 # 来定位页面的具体位置，格式为：# + id。
如果要定义一个死链接使用 javascript:void(0)` 。

相关标签 ： base 标签：标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接: **作用：**可以为页面上所有的a标签设置跳转的方式（书写位置：base标签一般放在title标签下面）
```
<head>
<base href="http://www.runoob.com/images/" target="_blank">
</head>
```

HTML—a链接标签

HTML—a链接标签

一.a 标签 (Anchor ) : 超链接（锚）

二.a标签的跳转功能

三.a 标签的属性

id 属性

实例：

四.创建假链接

a标签空链接href=#与href=javascript:的区别