下文笔者讲述“HTML 锚点”的简介说明,如下所示
HTML 锚点简介
html锚点的功能:
用于定位到html页面上的指定位置
使用锚点----可避免每次打开网页都在首页的现象
而直接转向到页面的指定位置
设置锚点的方法
一:页面内跳转设置方法一：
设置一个锚点链接<a href="#miao">进入锚点</a>
(注意:href属性的属性值最前面要加#)
页面上设置锚点<a name="miao"></a>；
(注意:a标签中要写一个name属性
属性值要与[1]中的href的属性值一样,不加#)
二:页面内跳转设置方法2
设置一个锚点链接<a href="#miao">进入锚点</a>；
(注意:href属性的属性值最前面要加#)
设置锚点的位置
<h4 id="miao">瞄点位置</h4>;
要跳转到的位置的标签中添加一个id属性
属性值与①中href的属性值一样，不加#
使用链接#锚点，即可链接到指定位置
例: 锚点示例
<!DOCTYPE html><html><head>
<meta charset="UTF-8">
<title>锚演示-html教程linux28.com</title>
</head>
<body>
<ul>
<li><a href="#miao">去找锚点1</a></li>
<li><a href="#wang">去找锚点2</a></li>
<li><a href="#meng">其他锚点3</a></li>
</ul>
<a name="miao"></a><!--设置锚点方法1-->
<h3 id="miao">喵星人基地</h3><!--设置锚点方法2-->
<p>锚点1~</p>
<p>锚点1~</p>
<p>锚点1~</p>
<p>锚点1~</p>
<p>锚点1~</p>
<p>锚点1~</p>
<a name="wang"></a>
<p>锚点2~</p>
<p>锚点2~</p>
<p>锚点2~</p>
<p>锚点2~</p>
<p>锚点2~</p>
<p>锚点2~</p>
<a name="meng"></a>
<p>锚点3~</p>
<p>锚点3~</p>
<p>锚点3~</p>
<p>锚点3~</p>
<p>锚点3~</p>
<p>锚点3~</p>
</body>
</html>