[翻译]标记语言和样式手册 Chapter 7 锚点(3)
作者:zhaozy 来源:3user.com 发布时间:2008-01-28 14:01:00
标签:样式,标记,css,手册,锚点
方法C:丢掉名称
<p><a href="#oranges">About Oranges</a></p>
...一些文字...
<h2 id="oranges">Oranges Are Tasty</h2>
...更多文字...
啊哈,id属性的功能就像name属性,同样能为页面指定锚点,除此之外,方法C还消除了方法A,B使用name属性是需要的额外<a>标签,我们减少了源代码,这向来是好事.
由于id属性可以加到任何标签里,因此我们能轻易地在页面内任意为需要的元素加上锚点.在这个例子中,我们选择为标题加上锚点,但我们也能同样轻易的为<div>,<form>,<p>,<ul>...还有其他所有标签加上锚点.
一石二鸟
事实上,在大多数情况下,我们都能为先前存在id属性添加样式或者scripting,这是方法C的另一个好处.由于这个缘故,我们不需要为仅仅设定锚点而加上额外的代码.
举例来说,让我们假设你在很长的页面底部有一个用来留下评论的表单,而你想在页首加上链接,这个表单已经为了指定独特样式而设了id="comments".这是我们能直接把id当作锚点进行连接,而不必再加上有name属性的<a>标签.
代码看起大概类似这样:
<p><a href="#comments">Add a Comment!</a></p>
...很多文字...
<form id="comments" action="/path/to/script">
...表单元素...
</form>
同时,如果你的页面很长,那么你在底部加上链接到顶部锚点的链接,以便用户"回到顶部".
值得一提的是:虽然看起来十分合适,但最好避免在指定锚点名称时使用"top",有些浏览器保留这个名称做为特殊用途,那么使用这个名称可能会造成不一致的结果,最好选择一个类似,但又不会造成问题的名称,或许用#gemesis?还是用#utmost?你自己拿主意了.
古老浏览器与id属性
只使用id属性当作锚点时,有个重要的缺点值得一提,那就是某些古老的浏览器并不支持这个方法.哦喔,在标识你自己的锚点时这的确是个必须考虑的问题,同时这也是向前兼容的不幸示例.让我们看看最后一个实例,方法D.


猜你喜欢
- 5,闭包 闭包意味着内层的函数可以引用存在于包围它的函数内的变量,即使外层函数的执行已经终止。 让我们先来看一个闭包的例子。 <scr
- 在项目中遇到一情况让困扰了半天,同一张PNG8图片为何部份图标在IE6中消失呢?当时一度怀疑是cache或hosts问题反反复复开关浏览器结
- 单例模式单例是一种创建型设计模式, 让你能够保证一个类只有一个实例, 并提供一个访问该实例的全局节点。单例拥有与全局变量相同的优缺点。 尽管
- <div class=”A” style=”position:relative;”>A 
- thinkphp查询mssql数据库出现乱码的原因是ThinkPHP默认为UTF-8,而msmsql数据库是简体中文版,存储的是GB2312
- 一.__eq__方法在我们定义一个类的时候,常常想对一个类所实例化出来的两个对象进行判断这两个对象是否是完全相同的。一般情况下,我们认为如果
- 参考: Smashing magzine翻译+整理: Demix当完成一项前端的工作之后,许多人都会忘记该项目的结构与细节。然而代码并不是马
- Python time模块时间获取和转换Time模块介绍Python的Time库可以进行时间相关的处理,如访问当前日期和时间,输出不同格式的
- 概述基于内容的图像检索技术是采用某种算法来提取图像中的特征,并将特征存储起来,组成图像特征数据库。当需要检索图像时,采用相同的特征提取技术提
- elasticsearch 的client ,通过 NewClient 建立连接,通过 NewClient 中的 Set.URL设置访问的地
- 举例吧,这样更容易看的懂。例1:from django.core.exceptions import ObjectDoesNotExistt
- Dreamweaver MX 2004的强大功能以及更加完善的人性化设置已经深受大家喜爱。在此笔者就谈
- check.asp 代码如下:<% '''''''''
- 本文实例讲述了mysql代码执行结构。分享给大家供大家参考,具体如下:本文内容:什么是代码执行结构顺序结构分支结构循环结构 首发日
- Pandas DataFrame 取一行数据会得到Series的方法如题,想要取如下dataframe的一行数据,以为得到的还是datafr
- 有的时候,我们本来写得好好的爬虫代码,之前还运行得Ok, 一下子突然报错了。报错信息如下:Http 800 Internal interne
- 原来的语句是这样的: select sum(sl0000) from xstfxps2 where dhao00 in ( select d
- 这篇文章主要介绍了JavaScript switch语句使用方法简介,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习
- 环境 python3.0工具 pycharm谷歌插件chromedriver程序执行方法from selenium import webdr
- 我们通常说的双机热备是指两台机器都在运行,但并不是两台机器都同时在提供服务。当提供服务的一台出现故障的时候,另外一台会马上自动接管并且提供服