这是我参与【第五届青训营】伴学笔记创作活动的第二天
- 超链接可以让我们从一个页面跳转到其他页面
或者是当前页面的其他位置
使用a 标签来定义超链接
属性:
href指定跳转的目标路径
-值可以是一个外部网站的地址
-也可以写一个内部页面的地址
超链接也是一个行内元素,在a标签中可以嵌套出他自身外的任何标签。
<a href="http://www.baidu.com">百度</a>
- 相对路径
当我们需要跳转一个服务器内部的页面时,一般我们都会使用相对路径
相对路径都会使用.或者..开头
./可以省略不写
./表示当前文件所在的目录
-在这里当前页面就是相对路径.html
./就等于相对路径.html 所在的目录path
../表示当前文件所在目录的上一级目录
<a href="./target3.html">超链接1</a> <br><br> <a href="../列表.html">超链接2</a> <br><br> <a href="./inner/target2.html">超链接3</a> <br><br> <a href="../outer/target4.html">超链接4 </a>
3.target属性
target属性,用来指定超链接打开的位置
可选值:
_self 默认值,在当前页面中打开超链接
_blank 在一个新的页面中打开超链接
<a href="../列表.html" target="_blank">超链接5</a>
<br><br>
<a href="#bottom">去底部</a>
<a href="#p3">去第三个自然段</a>
4.补充扩展
- 可以直接将超链接的herf 属性设置为#,这样点击超链接以后
页面不会发生跳转,而是转到当前页面的顶部位置。
可以跳转到页面的指定位置,只需将href属性设置#目标元素的id 属性值 - id 属性(唯一不重复的)
-每一个标签都可以添加一个id属性
-id属性就是元素唯一的标识,同一个页面中不能出现重复的id 属性 - 在开发中可以将#作为超链接的路径占位符使用。
<a href="#">这是一个新的超链接!</a>
<a id="bottom" href="#">回到顶部</a>