您的位置:首页 > Web前端 > 其它 > 正文

html锚点定位

更多 时间:2015-5-12 类别:Web前端 浏览量:73

html锚点定位

html锚点定位

一、在html中设置锚点定位的几种方法

1、使用id定位

使用id可以在任意标签使用。

2、使用name定位

使用name属性只能针对a标签来定位,而对li等其他标签就不能起到定位作用。

3、使用js定位

使用js使用scroollIntoView将对象滚动到可见范围内。

 

二、html锚点定位实例

  •  
  •  
  • HTML 代码   复制
  • 
    <!doctype html>  
    <html>
    <title>锚点 by starof</title>  
    <meta charset="utf-8"/>  
    <body>
     <a href="#top">到top</a><br/>
     <a href="#content">到content</a><br/>
     <a onclick="javascript:document.getElementById('here').scrollIntoView()" style="cursor:pointer;">到bottom</a>
     <li id="top"  class="cls1">top内容</li>
     <li>
      <a name="content">content内容</a><br/>
      name属性只对&lt;a&gt;标签有用。<br/>
      可以通过给li增加name="content" ,删除内部超链接查看。
     </li>
     <li id="here"  class="cls3">bottom内容
     </li>
    </body>
    </html>
    
    				
  •  

    标签:html锚点