网站布局CSS的继承性详解
日期：2008年12月19日 作者：-
CSS是层叠样式表(Cascading Style Sheets)的简称，它的规范代表了互联网历史上一个独特的发展阶段。现在对于从事网页制作的朋友来说，很少没有听说过CSS了吧，因为在制作网页过程中我们经常需要用到。
所谓CSS的继续是指被包在内部的标签将拥有外部标签的样式性质。继续特性最典型的应用通常发挥在整个网页的样式预设，需要指定为其它样式的部份设定在个别元素里即可。这项特性可以给网页设计者提供更理想的发挥空间。但同时继续也有很多规则，应用的时候轻易让人迷惑，今天就专门和大家聊聊这方面的应用。
一、继续
CSS的一个主要特征就是继续，它是依靠于祖先-后代的关系的。继续是一种机制，它答应样式不仅可以应用于某个特定的元素，还可以应用于它的后代。例如一个BODY定义了的颜色值也会应用到段落的文本中。下面举例说明：
样式定义：
body{color:red;}
应用举例代码：
＜p＞CSS的＜strong＞层叠和继续＜/strong＞深入探讨＜/p＞这段代码的应用结果是：“CSS的层叠和继续深入探讨”这段话是红颜色的，“层叠和继续”由于应用了strong元素，所以是粗体。这很符合制作者的意图，也是为什么继续是CSS的一部分的原因。
二、CSS继续的局限性
在CSS中，继续是一种非常自然的行为，我们甚至不需要考虑是否能够这样去做，但是继续也有其局限性。
首先，有些属性是不能继续的。这没有任何原因，只是因为它就是这么设置的。举个例子来说：border属性，大家都知道，border属性是用来设置元素的边框的，它就没有继续性。多数边框类属性，比如象Padding(补白)，Margin(边界)，背景和边框的属性都是不能继续的。
三、继续中轻易引起的错误
有时候继续也会带来些错误，比如说下面这条CSS定义：
body{color:blue}
在有些浏览器中这句定义会使除表格之外的文本变成蓝色。从技术上来说，这是不正确的，但是它确实存在。所以我们经常需要借助于某些技巧，比如将CSS定义成这样：
body,table,th,td{color:blue}
这样表格内的文字也会变成蓝色。
四、多种样式混合应用
既然有了继续性，那么在样式表中的应用上可能会有些读者搞不清，多个样式表同时应用到一个对象上会发生什么情形呢？先举个简单的例子：
样式定义：
.apple{color:red;}h1{color:yellow;}
应用举例代码：
＜h1 class="apple"＞这儿的苹果好红啊＜/h1＞应用举例效果：因为选择符h1和.apple都匹配上面的H1元素，那么到底浏览器会应用哪一个呢？通过在浏览器中观察，我们发现这段文字应用了.apple这个样式，所以它显示的是红色。这是因为两条规则的非凡性不一样，CSS规则必须这样进行处理。
样式表中的非凡性描述了不同规则的相对权重，它的基本规则是：
统计选择符中的id属性个数。
统计选择符中的class属性个数。
统计选择符中的html标记名格式。
最后，按正确的顺序写出三个数字，不要加空格或逗号，得到一个三位数。( 注重，你需要将数字转换成一个以三个数字结尾的更大的数)。相应于选择符的最终数字列表可以很轻易确定较高数字特性凌驾于较低数字的。
以下是一个按特性分类的选择符的列表：
h1 {color:blue;}特性值为：1
p em {color:purple;}特性值为：2
.apple {red;} 特性值为：10
p.bright {color:yellow;} 特性值为：11
p.bright em.dark {color:brown;} 特性值为：22
#id316 {color:yellow} 特性值为：100
从上表我们可以看出#id316具有更高的非凡性，因而它有更高的权重。当有多个规则都能应用于同一个元素时，权重越高的样式将被优先采用。
五、CSS继续的优先级问题
上面我们讨论了CSS的继续性和非凡性，在非凡性的框架下，被继续的特性值为0，这就意味着任何显示声明的规则将会覆盖其继续样式。因此，不管一条规则具有多高的权重，假如没有其他规则能应用于这个继续元素，那么它也只是个被继续的规则而已，举例说明。
样式定义：
body { background:black;}
li { color:gray;}
ul.white { color:white}
应用举例代码：
＜ul＞ - [1] [2] [3] 下一页
-
- 网站布局CSS的继承性详解 相关文章：
- 网站布局CSS的继承性详解 相关软件
- 特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
- 者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
- 载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com
| ·视频与图像RGB/YUV格式详解[图] |
| ·Flash声音控制详解 |
| ·使用HTML＋CSS编写灵活的Tab页[多图] |
| ·p2p详解 |
| ·进入主板BIOS之后.怎么 看硬盘能无法 存在？怎么 配置 ？要详解 |
| ·网站变黑白色CSS一行代码实现[图] |
| ·NETSTAT命令详解 |
| ·图文详解 Windows 2003服务器集群安装[多图] |
| ·插图详解C# |
| ·围棋定式详解 |
| ·网站设计计划书 |
| ·潇湘围棋定式详解 4.1 |
| ·Excel函数应用实例详解范例 |
| ·房友网站通 10.33 |
| ·PHP/MySQL无需编程轻松创建数据库网站 V4.0 |
| ·WAP建站技术详解与实例 |
下一篇:思科路由器出现崩溃解决办法