锚点是什么?
在W3C标准字“Anchor”一词即为锚点,其解释为:资源中的某个区域可以是零个、一个或多个链接的目标或源。锚点可以引用整个资源,或者的特定部分,或者资源的特定表现形式。
通俗的理解:锚点是一种超链接,只是它是页面内部的超链接。比如我们有一个网页很长很长,而且里面的内容,可以分为N个部分。这样的话,我们就可以在网页的顶部设置一些锚点,这样便可以方便浏览者点击相应的锚点,到达本页内相应的位置,而不必在一个很长的网页里自行寻找。
锚点的基本使用场景
当一个网页很长的时候,那么我们在翻阅这个网页的时候可能会有些不方便,比如我们已经翻阅到了底部之后想返回到顶部,那么只能拖动滚动条到顶部(或者刷新页面,但这个不是专业的做法),效果比较好的方法就是设置锚点来处理这个问题。
那么锚点如何设置呢?见如下代码:
这里就有两个锚点,一个名字叫做top,一个名字叫做bottom,其实a标签比较特殊,可以用name属性值来指定锚点的名称(当然也可以通过id值来指定锚点名称),其他标签只能通过id值来指定锚点名称,当id值为空的时候,默认锚点名称为#,即点击之后就是定位到本网页。
在以上代码中,锚点的使用可能不够合适,正确的做法是把锚点的position属性设置为fixed, 代码如下:
锚点的知识拓展
可以定位到本地其他html文件的一个锚点,也可以定位到外部网站的某个html文件的一个锚点(有ID属性的标签),代码示例如下: 01.html
在转到外部网站的界面的时候,这里选择了转到搜狐主页的一个锚点god_1,通过实验可以发现,右边滚动条确实不在最顶端,证明发生了定向。
02.html