a标签是网页中常用的一个标签,它通常用来创建一个指向其他网页、文件、电子邮件地址、当前网页指定位置或是其他任意类型的URL超链接。下面就为大家具体介绍下针对不同用途下的使用方法。
页面跳转
页面跳转是我们常用的功能之一,通常在导航栏或菜单栏等地方当用户点击某个选项后就会打开对应的页面。我们只需要给a标签的【href】属性设置对应的网页地址就可以实现用户点击的时候跳转了。
但是a标签默认会给显示的文字添加下划线,并且初始状态是显示蓝色的。我们可以通过给a标签设置css样式来改变这种状态。另外a标签默认是在当前页面打开链接地址,我们也可以通过给a标签设置【target】属性来实现在新的标签页中打开链接地址或者是在父级窗口中打开链接地址。
锚点链接
锚点可以在同一页面的不同位置间跳转,使用场景为当一个页面很长的时候可以设置章节导航,用户点击某一章节的时候页面就会跳转到对应章节的位置。我们只需要给a标签的【href】属性设置为【#+当前页面某a标签的name属性】的形式当用户点击链接的时候就会跳转到对应a标签所在的位置。
下载文件
a标签的【download】属性是在HTML5中新增的属性,它指示浏览器下载 URL 而不是导航到它,并且会提示用户将href指定的链接资源保存为本地文件。如果为【download】属性设置属性值的话,则该属性值将作为下载文件的文件名来保存文件。但如果是跨域下载文件则该属性值无效。
创建email链接
a标签可以指向一个email邮箱地址,当用户点击链接的时候会打开用户本地的邮件程序来发送邮件。具体形式为给a标签的【href】属性设置为如下的方式。
创建Tel链接
a标签还可以指向一个手机号,当页面在手机浏览器器中运行的时候,用户点击链接就可以调用手机的拨号界面,来实现网页中点击就能拨打电话的功能。具体形式为将a标签的【href】属性设置为如下的方式。
防止被搜索引擎收录
有时候我们并不希望a标签里的链接内容被Google或百度等搜索引擎抓取,这时候就需要使用a标签下rel属性来防止连接被收录。可以给该属性值设置为“externalnofollow”来实现该效果。【external 】属性表示这是一个相对于当前网站的外部资源,【nofollow】属性表示本文档的作者不想宣传该链接的文档。这对于外链或某些无意义链接非常有用。
好了,关于HTML5中a标签的几种使用方法就给大家介绍到这里,如果大家觉得不错的话可以添加收藏或关注,我会定期跟大家分享互联网相关的小知识