利用name或id属性设置页面跳转的锚点

理论准备

        网页中的链接按照链接路径的不同,可以分为3种类型,分别是内部类型、锚点链接和外部链接;
        按照使用对象的不同,网页中的链接又分为文本超链接,图像超链接,E-mail链接,锚点链接,多媒体文件链接,空链接等。

 
★ 利用name或id实现网页跳转锚点的设置(Anchor))
代码
  1. <style>
  2. body {
  3. text-align: center;
  4. }
  5. a:nth-child(odd){
  6. /*选取索引序号为基数的<a>标签*/
  7. position: absolute;
  8. top:2000px;
  9. border:1px solid;
  10. }
  11. </style>
  12. <h2>利用name或id实现网页跳转锚点的设置(Anchor)</h2>
  13. <hr/>
  14. <!--利用name属性-->
  15. <!--<a href="#footer" name="top">Go footer</a>
  16. <a href="#top" name="footer">Go top</a>-->
  17. <!--利用id属性-->
  18. <!--<a href="#footer" id="top">Go footer</a>
  19. <a href="#top" id="footer">Go top</a>-->
总结:
       同一个网页内部不同位置的锚点实现,无论是使用name属性,还是id属性在链接href中都必须加上#;
       不同网页间跳转到的指定位置,利用id属性能够实现,而name属性是不能的。如下代码,
  1. <!--原网页中的超链接-->
  2. <a href="ClosureDemo.html#out">跳到另外一个文档name或id为out的位置</a>
  3. <!--目标网页中的input设置-->
  4. <input type="text" id="out">
 
★ 利用<a>标签实现邮件发送
  1. <mark>邮件链接</mark>
  2. <a href="mailto:30726787@qq.com">使用OutLook或Foxmail等,发送邮件给30726787@qq.com</a>
     
 

 
注意点
    1.当链接对象为网站,则href属性值中的  “http://”   不可省略,否则链接会出现错误提示;
  1. <!--正确的写法-->
  2. <a href="http://www.baidu.com">百度</a>
  3. <!--错误的写法-->
  4. <a href="www.baidu.com">百度</a>
   2.当href不包含 “http://”  时,默认为当前页面所在的位置,即链接的对象与当前网页文件在同一文件夹的同一子菜单中;
 
上一篇:FTP-Linux中ftp服务器搭建


下一篇:cookies,sessionStorage 和 localStorage 的区别