超链接a标签——标签整理

今天，我发现我前天的一篇文章有七个人收藏了！！访问量有八百，还多了一个粉丝！！因为之前的粉丝都是熟人啊啊啊啊啊，为了7个收藏我文章的人和一个我的粉丝，我决定今天多更一篇！！

a标签超链接

废话不多说，先来上波图！！！

日常开发中，我们用a标签来生成一个超链接，帮助用户来导航！！

<a href = '' target = '' download = '' hreflang = ''></a>

属性整理

href属性

该属性用来定义资源的位置（url）
属性值：

• url字符串：可以是相对或绝对，如果是绝对地址，应该写全协议！！
• 锚点：以#号开始的某元素id，点击页面可以直接滚动至id所在位置！！
• 不填：占位符(失去默认外观和效果)

<a href = '/img/headimg.png' ></a>
<a href = '#xiabian' ></a>
<a href = '' ></a>

target属性

该属性用来定义打开页面的方式
属性值：

• _self 当前窗口，默认值
• _blank 新窗口
• _parent 父窗口，没有父窗口时，和self效果相同
• _top 顶层窗口 已经是顶层窗口时，和self效果相同

上图！！

上表格：
在不同的窗口上点击不同target属性的a标签的展示结果！

链接	窗口1	窗口2	窗口3	窗口4	窗口5
_self	1	2	3	4	5
_blank	新	新	新	新	新
_parent	1	1	2	3	4
_top	1	1	1	1	1

<a href = '/img/headimg.png' target = '_self'>从当前页打开页面</a>
<a href = '/img/headimg.png' target = '_blank'>新开一个页面打开</a>
<a href = '/img/headimg.png' target = '_parent'>从当前页（窗口）的父页面（窗口）打开该页面</a>
<a href = '/img/headimg.png' target = '_top'>从顶层页面（窗口）打开该页面</a>

download属性

html5新增，与href属性组合使用，表示下载资源
兼容性：IE不支持 safari:部分支持

<a href = '/img/headimg.png' download = 'logo'>下载logo</a>

hreflang属性

表示链接资源所使用的语言，只是提示，没有别的功能

<a href = '/img/headimg.png' hreflang = 'zh'>导航</a>

其他功能

• 利用href的url可以是浏览器支持的任何协议，可以用来短信、邮件、拨号、制作书签等

<a href = "sms:10086?body = '你好'" >发短信</a>
<a href = 'mailto：123@123.com' >发邮件</a>
<a href = 'tel:10086' >打电话</a>

下边真的可以不看 -----

想学习一些前端的书籍吗，我都帮你整理好啦！评论打出你想读的书，给你最全的笔记干货

超级全的前端知识，面试必备、系统复习必备哟哟哟

有想法评论提出哈，欢迎交流，小编也是渣渣一枚呢～一起进步呗

这次真的可以不看 -----

点个收藏呗，要不赞一个呗，小编手都敲累了，但还是持续加更呢～