HTML5中各种标签总结（超链接标签、锚点设置）
作者：互联网
一、超链接标签<a></a>
作用：实现页面的跳转功能
href：控制跳转的目标位置
target：_self:再自身页面打开（默认效果也是在自身页面打开）
_blank:在空白页打开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>超链接标签</title>
</head>
<body>
<!--超链接标签-->
<!--跳转到本地资源-->
<a href="文本标签.html">超链接1</a>
<br />
<!--跳转的目标找不到，提示找不到资源-->
<a href="abc.html">超链接2</a>
<br />
<!--跳转到网络资源-->
<a href="http://www.sogou.com">超链接3</a>
<br />
<!--_blank:在空白页打开-->
<a href="http://www.sogou.com" target="_blank">超链接4</a>
<br />
<!--_self:再自身页面打开-->
<a href="http://www.sogou.com" target="_self">超链接5</a>
图片超链接
<a href="https://www.baidu.com" target="_blank"><img src="img/curry.jpg" /></a>
</body>
</html>
二、设置锚点
应用场合：当一个页面太长的时候，就需要设置锚点，然后可以在同一个页面的不同位置之间进行跳转。
同一个页面不同位置的跳转：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>设置锚点</title>
</head>
<body>
<a name="1F"></a>
<h1>手机</h1>
<p>华为p40</p>
<p>华为p40</p>
<p>华为p40</p>
<p>华为p40</p>
<p>华为p40</p>
<p>华为p40</p>
<p>华为p40</p>
<p>华为p40</p>
<p>华为p40</p>
<a name="2F"></a>
<h1>化妆品</h1>
<p>大宝</p>
<p>大宝</p>
<p>大宝</p>
<p>大宝</p>
<p>大宝</p>
<p>大宝</p>
<p>大宝</p>
<a name="3F"></a>
<h1>母婴产品</h1>
<p>奶粉</p>
<p>奶粉</p>
<p>奶粉</p>
<p>奶粉</p>
<p>奶粉</p>
<p>奶粉</p>
<p>奶粉</p>
<p>奶粉</p>
<p>奶粉</p>
<a name="4F"></a>
<h1>图书</h1>
<p>thinking in java</p>
<p>thinking in java</p>
<p>thinking in java</p>
<p>thinking in java</p>
<p>thinking in java</p>
<p>thinking in java</p>
<p>thinking in java</p>
<p>thinking in java</p>
<p>thinking in java</p>
<a href="#1F">手机</a>
<a href="#2F">化妆品</a>
<a href="#3F">母婴产品</a>
<a href="#4F">书籍</a>
</body>
</html>
不同页面利用锚点：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>设置锚点</title>
</head>
<body>
<a href="设置锚点.html#1F">超链接</a>
</body>
</html>
标签：java,thinking,标签,华为,锚点,超链接,奶粉,p40 来源： https://blog.csdn.net/YZL40514131/article/details/122394675