设置锚点的三种方法_html/css_WEB-ITnose

最网页中经常会用到锚点来定位,这里就和大家说说我知道的三种锚点的使用目前我就知道三种,更多的方法暂时没去研究,有的话大家帮忙补充。现在和大家说的主要是最常用最简单的方法。

1.使用 id 定位

先和大家说说最常用的 ID定位 ,这几乎是所有网站最常用的一种定位方式了。这种定位最大的好处就是可以针对任何标签来定位

使用说明:设置一个锚点 id,然后用 href 属性点位到该锚点id,具体实例代码如下:

                        li{                display: block;                margin-bottom: 4px;                width: 100px;                height: 20px;                background: #eee;                text-align: center;            }        

登录后复制 定位到A ⇒A

由于代码有点长,所以下面的代码基于上面的代码进行简略。大家可以电脑上自己试试。

登录后复制

2.使用 name 定位

第二种定位的方式就有所限制了,使用 name 定位只用于 标签,其他的标签就不管用了。

... ... 

登录后复制登录后复制 定位到A … … 定位到A … …

3.使用 js 定位

第三种方式的使用就如下面的,不过我不是很喜欢这种用法。

立即学习“前端免费学习笔记(深入)”;

... ... 

登录后复制登录后复制 … … 定位到A … …

对于上面的三种用法,大家不一定都用的到,用到的也许就只有第一种。自然我这边也是推荐大家用第一种。

在运行代码的时候,大家会发现锚点都是用跳的,完全没有过渡的效果。不过没关系,这也是我写这篇文章奠定基础的原因。我会在我接下来的文章里和大家介绍锚点跳转时屏幕滚动的效果。《前端屏幕滚动效果》

谢谢大家查阅我的文章,希望能帮到你,^_^

登录后复制

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3118873.html

(0)
上一篇 2025年3月29日 14:22:14
下一篇 2025年3月29日 14:22:21

AD推荐 黄金广告位招租... 更多推荐

发表回复

登录后才能评论