跳转锚点适用于本页面和其他页面的任意标签的跳转以及JavaScript的运行
使用方法即给标签加上独一无二的id属性,再使用a标签跳转
如果是其他页面的标签只需加上其他页面的路径,eg.href="其他页面的路径#zp1"
id属性的最好不要使用数字开头
<a href="#zp1" >看照片1</a>
<a href="#zp2" >看照片2</a>
<a href="#zp3" >看照片3</a>
<a href="#zp4" >看照片4</a>
<p id="zp1">照片1</p>
<img src="./image/test.jpg" alt="照片1">
<p id="zp2">照片2</p>
<img src="./image/test.jpg" alt="照片2">
<p id="zp3">照片3</p>
<img src="./image/test.jpg" alt="照片3">
<p id="zp4">照片4</p>
<img src="./image/test.jpg" alt="照片4">
<p>介绍完毕!</p>
<a href="#">回到顶部</a>
<a href="">刷新页面</a>
<a href="javascript:alert(123);">点我弹窗</a>
显示效果如下:
整体效果:
eg.
1.点击照片跳转锚点3
2.点击回到顶部锚点
3.点击刷新页面锚点(因为刷新以后会默认回到顶部所有也有回到顶部的作用)
4.点击弹窗锚点