Html中锚点的使用【转】

Html中锚点的使用
今天突然想用锚点了,虽然这东西在平常的网页设计中很少用到,但是今天做了个很长很长的表格,找起来很麻烦,就想到弄这个了,发现现在自己什么都不会了啊.要重头学起了...
先总结一下锚点怎么使用.比如我有两个标题,分别是贝落格和锚点使用教程.那么我们需要给这两个标题做两个标记
也就是下文的<a name="a1">贝落格</a>还有 <a name="a1">锚点使用教程</a>
在目录上我们只要标记<a href="#a1">贝贝</a1>就能够很快的索引到贝落格这个标题了~
当然....
这种方法不太好：一是产生一个无意义的 a 标签；二是 a 标签缺少 href 属性，不符合 XHTML 标准；三是多了 name 属性，不符合 XHTML 标准。
使用 id 时，我们不再局限于 a 标签，可以用于其他标签，比如可以是：
<h2 id="a1">贝落格</h2>
这种用 id 做锚点在 IE、Firefox、Chrome、Opera 中都是受支持的。
使用方法就是这么简单.呵呵.下面看看网上搜集来的教程~
1：锚点是什么？
锚点也可以理解成为一种超级链接，只不过它是网页内部的超级链接（注意不是网站内部）。
比如我们有一个网页很长很长，而且里面的内容，可以分为N个部分。这样的话，我们就可以在网页的顶部设置一些锚点，这样便可以方便浏览者点击相应的锚点，到达本页内相应的位置，而不必在一个很长的网页里自行寻找。
2：锚点的使用。
锚点从代码上看，仍然是超级链接的一种应用。
<a name="A1" id="A1"></a>这样的一个无内容的<a>标签，便是一个锚点了，我们可以把它放在网页中<body& gt;与</body>之间的任意位置。当然，究竟放在哪个位置，就要看我们的实际需要了。
下面举一个例子：

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
 5 <title>锚点示例</title>
 6 </head>
 7
 8 <body>
 9 <a name="A0" id="A0"></a>
10 <a href="#A1">网页第一部分</a>
11 <a href="#A2">网页第二部分</a>
12 <div style="height:900px; background:#CCCCCC"></div>
13 <a name="A1" id="A1"></a>1<a href="#A0">返回顶部</a>
14 <div style="height:900px; background:#999999"></div>
15 <a name="A2" id="A2"></a>2<a href="#A0">返回顶部</a>
16 <div style="height:900px; background:#666666"></div>
17 </body>
18 </html>

另外再说一下，<a name="A0" id="A0"></a>中的name与id，可以只使用一个，但某些情况下，只是用name会造成锚点无效的错误。建议还是name与id同时使用。

推荐使用id~呵呵~但是根据教程上说的~id 和name 一起用也貌似不错~不过遵循xhtml规则的话.还是老老实实的定义id吧~
本文来源于贝落格 http://www.baybey.net/ , 原文地址：http://www.baybey.net/post/840.html

来源：http://www.cnblogs.com/alex-bn-lee/archive/2012/03/03/2378835.html

转载于:https://www.cnblogs.com/seazeg/archive/2012/05/01/2478249.html

Html中锚点的使用【转】相关推荐

html语言如何设计锚点,网页html中锚点（描点）定位或书签跳转的实现方法 |
如果你在网页中想点击一个链接进入到这个网页同个页面的某个位置,或者是不同页面的某个位置,怎么办呢? 嘿嘿,这里就教大家一个方法,网页html中锚点(描点)定位或书签跳转的实现方法. >>& ...
网络推广专员教大家网站SEO优化中锚文本的使用技巧
网站优化中有许多细节需要网络推广专员中优化人员们的更多注意,其中之一就是描文本.其实,锚文本就是给一个关键词加上一个链接跳转到需要的页面,广泛的应用到网站的方方面面,应用的好能有效促进网站收录,帮助提 ...
浅析网站优化中锚文本的使用技巧
其实在网站优化中有很多来源于实际经验总结的技巧与细节,这些内容对于新手来说是宝贵的财富,今天想要给大家分享的就是关于锚文本的使用技巧的分析.众所周知,锚文本就是给关键词加上链接跳转到需要的页面并应用在 ...
Html中锚点的使用
概述 URL是由多个部分组成.包括协议.主机(域名).端口.路径.查询参数和锚点 https://www.example.com:80/path/to/myfile.html?key1=value1& ...
html中锚记标记的隐藏,在 Dreamweaver 中选择、查看和设置不可见元素 - Dreamweaver 用户指南...
选择哪些元素应设置为可见,然后单击"确定". 注意:对话框中元素名称旁边的选中标记表示当选择"查看">"可视化助理">" ...
html中锚点的应用【本页面跳转】
设置锚点 <a name="top"></a> 同页跳转 <a href="#top">返回顶部</a> 不同页 ...
html 图片加锚点,html中锚点的实现
Hi,大家好久不见,今天我们在这里给大家介绍一下在html页面中的拖放功能的实现:至于运用呢,比如有:点击某一张图片,然后转到对他的详细介绍等:接下来就给大家详细介绍一下如何实现. 那我们该如何创建使 ...
html网页中的锚点(命名锚记)的使用介绍
1.锚点是网页制作中超级链接的一种,又叫命名锚记.命名锚记像一个迅速定位器一样是一种页面内的超级链接,运用相当普遍. 英文名:anchor 使用命名锚记可以在文档中设置标记,这些标记通常放在文档的特定 ...
php分页命名锚记怎么用,网页中的锚点(命名锚记)的使用介绍
1.锚点是网页制作中超级链接的一种,又叫命名锚记.命名锚记像一个迅速定位器一样是一种页面内的超级链接,运用相当普遍. 英文名:anchor 使用命名锚记可以在文档中设置标记,这些标记通常放在文档的特定 ...
Markdown中使用锚点
Markdown的语法是不支持锚点的,可以使用HTML的锚点语法,在页面中点击一个链接跳转到页面中锚点所在的位置. 建立一个跳转的链连接,这个语法和普通链接的语法一样,区别就是括号内的链接以#起始. ...

Html中锚点的使用【转】

Html中锚点的使用【转】

Html中锚点的使用【转】相关推荐

最新文章

热门文章