我们应该知道的<a>标签
来源:互联网 发布:gif制作 知乎 编辑:程序博客网 时间:2024/06/11 17:49
说明
<a>
标签定义超链接,用于从一个页面链接到另一个页面。 <a>
元素最重要的属性是 href 属性,它指定链接的目标。
href属性
href属性的值,类型不同,产生的效果也不同,有人叫这是<a>
标签的多种不同的表现形式,或者说是不同种类的<a>
,好吧其实就是一个意思,我们来看看有哪些情况。
1、当目标文档为资源下载,点击会下载这个文件
<a href="xxx.rar/xxx.zip">下载</a>
这里要顺便提下<a>
的另一个属性,download,这是专门用来做下载的属性 <a href="/images/logo.png" download="文件名">下载</a>
download也可以没有值,这样会使用默认的文件名。
2、电子邮件链接
<a href="mailto:电子邮件地址">内容</a>
3、返回页面顶部空链接
<a href="#">返回顶部</a>
注意:设置超链接时,如果不确定要链接到哪个位置处时,请使用#,
因为 href="",
会刷新页面,而href="#"
,还在这个页面,默认回到最顶部
4、锚点
- 作用
在页面中的某行位置处,做一个记号,方便页面能够随时跳转到记号位置处 - 使用方式
- 定义锚点
1、通过 a 标记的 name 属性定义锚点<a name="名称">内容</a>
2、通过 任意标记的 id 属性定义锚点<ANY id="名称">
- 链接到锚点
1、跳转到本页的锚点处<a href="#锚点名称">内容</a>
2、跳转到其他页锚点处<a href="页面URL#锚点名称">内容</a>
- 定义锚点
5、链接到JS
<a href="javascript:JS代码块">执行JS功能</a>
我们应该经常会看到这样的写法 <a href="javascript:void(0)"></a>
void 是 JavaScript 中非常重要的关键字,该操作符指定要计算一个表达式但是不返回值。
当用户点击时,void(0) 计算为 0, Javascript 上没有任何效果,不会发生跳转。 href="#"
与href="javascript:void(0)"
的区别
# 包含了一个位置信息,默认的锚是#top 也就是网页的上端。
而javascript:void(0), 仅仅表示一个死链接。
6、一键拨号
<a href="tel:10000">点击拨号10000</a>
7、发短信
格式:sms:手机号[,手机号][?body=短信内容]
- 给一个号码发送短信
<a href="sms:10000">给 10000 发短信</a>
- 给一个号码发送,已编辑好的短信
<a href="sms:10000?body=xxx">给 10000 发送内容为"xxx"的短信</a>
- 给多个号码发送短信
<a href="sms:10000,10086?body=xxx">给 10000 和 10086 发送内容为"xxx"的短信</a>
href属性说到这也差不多了,我们来看另一属性target(目标)
target属性
target 属性规定在何处打开链接文档 <a target="_blank|_self|_parent|_top|framename"></a>
总结
到此,<a>
标签很多有趣的事情,相信大家都知道了,但是这还不是所有的,还有更多的事情,需要大家去发现,希望大家发现之后分享出来。
- 我们应该知道的<a>标签
- 我们应该知道的数据
- 我们应该知道的野火
- 我们应该知道的急救小常识
- 我们应该知道的急救小常识
- 我们学过 飞鸽传书 的应该知道
- 我们应该知道的76个常识
- 除了技术我们还应该知道的
- 我们应该知道的软件开发过程
- 我们应该知道的十二个法则
- 我们应该知道的java位运算
- 我们应该知道这两只老鼠
- java 内部类我们应该知道的的知识
- 你知道我们的耳朵应该多久掏一次吗
- 关于数据科学家,我们应该知道的这些事
- 作为程序员我们应该知道什么
- 我们应该记住的
- 我们应该思考的...........
- 前言
- WOJ 656 最小生成树 Prim
- 文章标题
- Python 备忘录
- 写给初学者25_android_数据持久化_slqlite
- 我们应该知道的<a>标签
- ZOJ 3494 BCD Code(数位dp+AC自动机)
- python使用selenium调用edge浏览器webdriver
- 【MySQL-性能优化】--MySQL外键约束简述
- bzoj 3709: [PA2014]Bohater 贪心
- 基于tp5文件上传到七牛云的插件
- 写给初学者26_android_数据持久化_LitePal_更简单的数据库操作
- JavaSE学习之IO流使用技巧
- Bone Collector hdu2602(经典dp)01背包