本文共 3048 字,大约阅读时间需要 10 分钟。
<a>元素术语文本元素,有一些私有属性或者叫做局部属性。那么,相对应的还有通用属性,或者叫全局属性。
href:指定<a>元素所指资源的URL
hreflang:指向的链接资源所使用的语言
media:说明所链接资源用于哪种设备
rel:说明文档与所链接资源的关系类型
target:执行用以打开所链接资源的浏览环境
type:说明所链接资源的MIME类型(比如text/html)
这这几个属性当中,只有href和target一般比较常用。href是必须的。
href属性:
<a href="
解释:href是必须属性,否则<a>元素就变成空元素了。如果属性值是“http://”开头的,意味着点击跳转到指定的外部链接
target属性:
<a href="http://www.baidu.com" target="_blank">百度</a>
解释:target属性告诉浏览器希望将所链接的资源显示在哪里。如果不写,默认是_self,在当前窗口打开超链接
相对路径和绝对路径
所谓相对路径,就是相对于链接页面而言的另一个页面的路径。而绝对路径,就是直接从
file://磁盘开始的完整路径。我们在同一个目录下做上两个页面,其中一个页面链接到另一个页面。
1、绝对路径
<a href="file:Users/cengchengpeng/Documents/html_test/index.html">index</a>
解释:首先是file:///开头,然后是路径。
2、相对路径
<a href="index.html">index.html</a>
解释:相对路径的条件是必须文件都在同一个目录中或磁盘中。如果是在同一个主目录中,中间有多个子目录层次,则需要使用目录结构语法
3、目录语法
同一个目录:index2.html或者./index2.html
在子目录中:xxx/index2.html
在父目录中:../xxx/index2.html
锚点设置
超链接也可以将同一个文档中的另一个元素移入视野,通过属性id或者name实现锚点定位。
//链接
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | < a href = "#1" >第一章</ a > < a href = "#2" >第二章</ a > < a href = "#3" >第三章</ a > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < a name = "1" >这是第一张内容</ a > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < a name = "2" >这是第二章内容</ a > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < a id = "3" >这是第三章内容</ a > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > < br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br > |
当在页面上点击“第一章”时,页面会自动跳转到“这是第一章内容”这里。