CSS3秘笈：第五章

第五章  层叠管理样式

1.层叠是决定哪些样式属性要被应用到某一个元素的一套规则。

2.最近的祖先样式胜出：浏览器会采用离相关标签最近的样式。

3.直接应用的样式胜出：任何直接应用于指定标签的样式都战胜了继承来的属性。

4.多个样式可能应用于同一个标签的几种情况：

·标签同时应用了一个标签选择器和一个类样式。例如，<h2>标签有标签样式和类样式.leadHeadline，还有这样的HTML代码：<h2 class=”leadHeadline”>Your Future Revealed!</h2>。这两个样式都应用于这个<h2>标签。

·同一个样式名称在样式表里出现了不止一次。同一个样式表里面可能同时有一个群组选择器和一个类样式 .leadHeadline。这两个规则都定义了任何带有leadHeadline类的元素的展示效果。

·一个标签同时应用了类和ID样式。也许是一个名为#banner的ID，以及一个名为.new的类，还有这样的HTML代码：<div id=”banner” class=”news”>。banner和news样式中的属性都应用于这个<div>标签。

·多个样式表中都包含了附给某一个网页的同一个样式名称。同名的样式可能通过链接外部样式表而引入，也可能通过内部样式表而引入。或者，相同的样式也可以出现在链接到同一个页面的多个外部样式表文件中。

·有些复杂的选择器瞄准了同一个标签。如果多个样式应用于某个元素，那么Web浏览器会合并所有这些样式的属性，只要它们不发生冲突。

5.用权重值决定哪种样式胜出。CSS有这样一个权重值计算系统：

·一个标签选择器值1分。

·一个类选择器值10分。

·一个ID选择器值100分。

·一个内建样式值1000分。

·伪元素通常被当做标签选择器对待，值1分，伪类通常被当做类，值10分。

权重值相同时最后一个样式胜出。

6.当你一定要确保一个特定的属性不能被其他更具体的样式覆盖的时候，就在属性的后面插入！important。可以避免它被权重更大的属性覆盖。

7.选择性的覆盖。

（1）创建一个内部样式表，列出要使之失效的清单。将外部样式表放在内部样式表之前，这样就可以确保在两个样式权重相同时，内部样式表会胜出。

（2）再创建一个样式表，除了把它附给styles.css样式表之外还要附给首页。

8.避免权重战争：

应尽量使用类选择器代替ID选择器，因为类名可以重复，但是ID名唯一，且ID选择器功能太强大只有更强大的权重才能覆盖它。

9.重新创建样式：

为了避免浏览器之间的显示差异，必须从头开始创建样式。就是删除浏览器的所有内建样式，重新设置你自己的样式。删除浏览器的样式的概念称作CSSreset。