7.1 属性
- href：链接地址
- target：控制链接的打开方式。
- _self(默认)-在当前页面打开；
- _blank-新标签页打开。
7.2 <base />标签
- 作用：改变链接的默认行为
- 位置：在head标签中
- 属性：href——改变默认链接；target——改变默认目标。
7.3 可作为锚点
- 作用：跳转到本页指定id的标签位置
- 使用：
- 1）# id：a标签 href="#id"，锚点 id="";
- 2）# name：a标签 href="#name"，锚点 a标签 name="";
7.4 练习
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
a{
display: inline-block;
text-decoration: none;
color: #eee;
background-color: rgb(28, 28, 30);
text-align: center;
height: 20px;
line-height: 20px;
width: 50px;
border-radius: 10px;
}
a:hover{
color: #eee;
background-color: rgb(50, 50, 50);
}
.stuff{
border: 1px solid rgb(28, 28, 30);
/* 达不到效果可增加高度 */
height: 1000px;
}
</style>
<!-- 改变所有a标签默认行为 -->
<base href="" target="_blank">
</head>
<body>
<!-- 在新的标签页打开vue官网 -->
<a href="https://cn.vuejs.org" target="_blank">Vue</a>
<!-- 跳转到bottom锚点位置 -->
<a id="top" href="#bottom" target="_self">底部</a>
<!-- 填充 -->
<div class="stuff"></div>
<!-- 跳转到top锚点位置 -->
<a name="bottom" href="#top">顶部</a>
</body>
7.5 效果预览
