html <a>标签属性总结

该标签主要作用

-通过href属性来创建指向另一个文档的链接
-通过name属性创建文档内的书签
href或name是必选属性


href属性

href 规定了链接地址:

-文字链接

<a href="http://www.baidu.com">百度一下</a>

-图片链接:

<a href="http://www.baidu.com">
<img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png">
</a>

href三种可能的值:

-绝对 URL - 指向另一个站点

href="http://www.example.com/index.htm"

-相对 URL - 指向站点内的某个文件

href="index.htm"

-锚 URL - 指向页面中的锚

href="#top"

用法-设置一个没有下划线的链接

<a href="http://www.baidu.com" style="text-decoration:none">这是一个链接</a>

name规定了锚的名称

相对链接

<a href="#h1">跳到第一章</a>
...
<h1>
<a name="h1">第一章</a>
<!--这里的name可以换成id-->
</h1>
<p>本章的内容有....</p>

绝对链接

<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>
<!--这段代码会让用户直接进入这个网站的这个anchor下-->

关于name和id

id和name都可以与href结合起来使用,同理name的值在同一文档必须是唯一的

关于图形映射:

<a href="http://www.baidu.com/xxx.html" shape="rect" coords="0,0,96,99">sun</a>

-只有图形可以添加映射,尽量用map元素和area元素设定图像映射
-<a>标签的shape和coords属性只支持opera和firefox浏览器

shape 规定链接的形状

shape的值:

default 全部区域
rect 矩形
circle 圆形
poly 多边形

coords 规定链接的坐标

coords的值:

如果shape是rect,coords的值为x1,y1,x2,y2,规定左上角和右下角的坐标
如果shape是circle,coords的值为x,y,radius,规定圆心的坐标和半径
如果shape是poly,coords的值为x1,y1,x2,y2,xn,yn,规定多边形各边的坐标,如果最后一个坐标和第一个不一致,浏览器为了关闭图形,会添加最后坐标

关于上下文关系

rel 指定从源文档到目标文档的关系
rev 指定从目标文档到源文档的关系
(rel和rev是写给浏览器看的,表明了上下文关系,w3school提出html和xhtml并没有正式提出这两种属性)
以下是一些值:

描述
alternate文档的可选版本(例如打印页、翻译页或镜像)
stylesheet文档的外部样式表
start集合中的第一个文档
next集合中的下一个文档
prev集合中的前一个文档
contents文档目录
index文档索引
glossary文档中所用字词的术语表或解释
copyright包含版权信息的文档
chapter文档的章
section文档的节
subsection文档的子段
appendix文档附录
help帮助文档
bookmark相关文档
nofollow用于指定 Google 搜索引擎不要跟踪链接
licence授权
tag标签
friend友情链接

target定义被链接的文档在何处显示

<a href="http://www.baidu.com" target="_blank">这是一个链接</a>

target的值:

_top 跳出框架打开网页
_parent 在父窗口打开网页
_blank 在新窗口打开网页
_self 默认值,在同一框架中打开网页
framename 在指定的框架中打开网页

用法实例:

<a href="/index.html"
target="_top">请点击这里!</a>

其他

download 规定被下载的目标,即点击后直接下载某个目标 (H5)
media 规定目标文档是专为什么样的平台设计的,没有实际作用 (H5)
type 规定了文档的mime类型,比如”text/css”
X/charset 规定链接的字符集(w3shool标记为所有浏览器不支持)
X/hreflang 规定链接文档的语言(w3shool标记为所有浏览器不支持)

用mailto:创建邮件

一个完整的格式

<a href="mailto:jk.2013@qq.com?cc="sipallan@163.com&bbc="joe5213@qq.com&subject=这是一封邮件&body=我想你">发送邮件</a>

注意点
1、多个收件人,抄送和密件抄送人用分号;分割
2、收件地址和抄送地址用?号分割,其他用&号分割

  • 23
    点赞
  • 103
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值