html5_锚点,点击到相应的位置

最新推荐文章于 2023-08-25 16:49:23 发布

绅V科技

最新推荐文章于 2023-08-25 16:49:23 发布

阅读量1.2k

点赞数

本文链接：https://blog.csdn.net/Android___vv/article/details/78252980

版权

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        ul li{
            list-style: none;
            float: left;
            margin: 10px;
        }
    </style>
</head>
<body>

 <ul>
     <!-- 点击到相应的位置 ,根据id走-->
     <li><a href="#a">首页</a></li>
     <li><a href="#b">新闻</a></li>
     <li><a href="#c">体育</a></li>
     <li><a href="#d">游戏</a></li>
 </ul>
//清除浮动
<div style="clear: both">
    <a id="a"></a>
    <h2>首页</h2>
    <hr>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>

 <div>
     <a id="b"></a>
     <h2>新闻</h2>
     <hr>
     <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
 </div>

 <div>
     <a id="c"></a>
     <h2>体育</h2>
     <hr>
     <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
 </div>

 <div>
     <a id="d"></a>
     <h2>游戏</h2>
     <hr>
     <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
 </div>

</body>
</html>