1、超链接
(1)超链接可以让我们从一个页面跳转到其他页面,或者当前页面的其他位置。
-使用a标签来定义超链接
-属性:
href指定跳转的目标路径
值可以是一个外部网站的地址
也可以写一个内部页面的地址
超链接也是一个行内元素,在a标签中可以嵌套除它自身外的任何元素。
示例:
<a href="https://www.baidu.com">超链接1</a>
<br><br>
<a href="https://www.jd.com">超链接2</a>
<!--
同一目录下的页面
-->
<br><br>
<a href="07_liebiao.html">超链接3</a>
其中超链接1和超链接2会分别跳到百度和京东相应的界面,而超链接3则会跳到自己写的界面中去。
(2)超链接中的其他属性:
-target:用来指定超链接打开的位置
可选值
_self :默认值,表示在当前页面打开超链接
_blank:在新的页面中打开超链接
-id属性(唯一不重复)
每一个标签都可以添加一个id属性
id属性就是元素的唯一标识,页面中不能出现重复的id属性
(3)可以直接将超链接的href属性设置为#,这样点击超链接以后,页面不会发生跳转而是转到当 前页面顶部的位置
也可以跳转到页面的任意位置,只需将href设置为 #目标元素的id属性值
如:<a id="bottom" href="#">回到顶部</a> (点击超链接回到页面顶部并将超链接的id设为 bottom)
<a href="#bottom">去底部</a> (点击超链接跳转至页面底部)
(4)【注】在开发中可以将#作为超链接的路径的占位符使用,但是这个超链接会回到当前页的 顶部。
也可以使用javascript:;来作为href的属性,此时这个超链接什么也不会发生。
2、相对路径
当我们需要跳转到项目内部页面时,一般使用相对路径。
-相对路径一般都会使用./或../开头(./可以省略,若不写./也不写../就默认写了./)
./表示当前文件所在的目录
../表示当前文件所在目录的上一级目录