html 锚点使用

 时间:2026-02-14 20:28:02

1、方法一:

        ①:设置一个锚点链接<a href="#miao">去找喵星人</a>;(注意:href属性的属性值最前面要加#)

        ②:在页面中需要的位置设置锚点<a name="miao"></a>;(注意:a标签中要写一个name属性,属性值要与①中的href的属性值一样,不加#)标签中按需填写必要的文字,一般不写内容

2、  方法二:

        ①:设置一个锚点链接<a href="#miao">去找喵星人</a>;(注意:href属性的属性值最前面要加#).

        ②:设置锚点的位置  <h3 id="miao">喵星人基地</h3>;在要跳转到的位置的标签中添加一个id属性,属性值与①中href的属性值一样,不加#

        方法二不用单独添加一个a标签来专门设置锚点 ,只在需要的位置的标签中添加一个id即可。

3、小案例:( bidh.html )

<!doctype html>

<head>

    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

    <title>萌宠集结号</title>

</head>

<body>

    <ul>

        <li><a href="#miao">去找汪星人</a></li>

        <li><a href="#wang">去找燃气</a></li>

        <li><a href="#meng">去找萌物</a></li>

    </ul>

    

    <p id="miao">喵星人基地<!--设置锚点方法2-->

    汪星人~

    汪星人

    汪星人~

    汪星人~

    汪星人~

    汪星人~

    

    <a name="wang"></a>

    燃气~

    燃气~

    燃气~

    燃气~

    燃气~

    燃气~

    <a name="meng"></a>

    萌物~

    萌物~

    萌物~

    萌物~

    萌物~

    萌物~

</body>

</html>

  • 静态网页跟动态网页有什么区别
  • Dw CC 2018怎么默认文档为文本
  • Dreamweaver如何插入段落
  • HBuilderX设置div标签分栏显示
  • 如何用HTML+CSS制作导航条
  • 热门搜索
    公司起名大全 胎教故事大全 官场小说大全 油画棒画图片大全 小学生班级口号大全 盛中国简介 火车事故视频大全 衣柜效果图大全2020款 杨钰莹歌曲大全 儿童图画大全