HTML超链接

 超链接是HTML中的一个重要标签。

<a>标签用以定义超链接,作用是从一个页面跳转到另一个页面。

一、基本用法

<a href="跳转目标" target="目标窗口的弹出方式" title="超链接的介绍信息">文本或图像</a>

例如:

<a href="https://www.bilibili.com/" target="_blank" title="点击可跳转到哔哩哔哩">哔哩哔哩</a>

二、三种重要属性

1.href属性

href属性是超链接标签必须存在的属性,href用于连接目标的URL地址。

2.target属性

target用于指定页面的连接方式。其中_self是默认值,即在当前窗口打开连接的打卡方式,_blank为在新窗口的打开方式。

3.title属性

title为超链接设置一些介绍信息。当鼠标移到设置了title属性的超链接上时,会显示title属性值的内容。

三、连接分类

1.外部链接

外部链接是该网站网页跳转到另外一个网站的网页的连接。外部链接一定是 http:// 开头的。

例如:从自己的网页跳转到百度:

<a href="https://www.baidu.com/">百度</a>

2.内部链接

网站内部页面之间的相互跳转。内部连接直接连接内部页面名称。且通常使用相对路径。

<a href="02-vscode.html">内部链接</a>

3.空链接

当我们没想好或不知道链接到哪个页面时,我们可以先写一个空超链接。超链接要求必须存在href,所以当我们要写超链接时,规定href属性为"#",不能空白噢。

<a href="#">空链接</a>

4.下载链接

1.当在同一目录时,通过点击超链接可以直接下载文件,地址链接的文件.exe,或者zip等压缩包,href属性值赋予地址即可。

<a href="文件地址">点击超链接下载文件或压缩包</a>

2.浏览器可以直接打开图片或.txt文档,如果我们希望浏览器不打开直接下载,则可以通过download属性来实现这一功能。

<a href="下载地址" download="名字"></a>

5.各种网页元素链接

网页中的各种元素也可添加链接,如文本,图片,表格,音频,视频等可添加超链接。

例如:链接到一张QQ图标的图片

<a href="222.png"><img src="222.png"></a>

6.锚点链接

锚链接可以链接到本页面的特定位置,也可以链接到另一个页面的特定位置。其实现方式是添加锚标记。即:

<a href="#名字">跳转</a>,"#"必不可少。

<标签名 id="与刚才的名字一致"></标签名>

关于“#标记名”,它其实是页面中某一个标签的id属性值。也就是说,如果要跳转到网页的某个位置,就先在这个位置所在的标签设置id属性,然后就可以通过锚链接跳转到这个位置了。

1.当跳转到当前页面的特定位置时,直接将锚标记设为href属性的值。如:

<a href="#top">跳转到本页面的id标记处</a><br/>
<h3 id="top">标记处</h3>

2.当跳转到另一个网页的特定位置时,将锚标记添加到链接地址的末尾。如:

<a href="http://www.baidu.com#标记名">跳转到另一个页面的标记处</a>

<a href="https://www.bilibili.com/#标记名">跳转到哔哩哔哩动画</a>

  • 32
    点赞
  • 195
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值