最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
CSS继承性之深入剖析(3)
时间:2022-07-02 12:43:44 编辑:袖梨 来源:一聚教程网
CSS继承性在应用中存在,那么在样式表中可能会有些读者搞不清,多个样式表同时应用到一个元素对象上会发生什么情形呢?先举个简单的例子,请运行下面的代码:
CSS网页布局 -
[ 可先修改部分代码 再运行查看效果 ]
我们会看到运行的效果:因为选择符h1和.aaa都匹配上面的h1元素,那么到底浏览器会应用哪一个呢?通过在浏览器中观察,我们发现这段文字应用了.aaa这个样式,所以它显示的是红色。这是因为两条规则的特殊性不一样,CSS规则必须这样进行处理。而字体的大小,却是h1默认的大小。
样式表中的特殊性描述了不同规则的相对权重,它的基本规则是:
统计选择符中的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具有更高的特殊性,因而它有更高的权重。当有多个规则都能应用于同一个元素时,权重越高的样式将被优先采用。
相关文章
- 鸣潮嘉贝莉娜培养攻略 09-15
- 三角洲行动改装方案大全 全枪械最新热门改枪代码合集 09-15
- 魔兽世界洛克莫丹稀有宝宝在哪抓-洛克莫丹稀有宝宝位置分享 09-15
- 无主之地4锻造骑士亚蒙技能树一览 锻造骑士亚蒙职业技能有什么 09-15
- 无主之地4铁骨战士法拉技能树一览 铁骨战士法拉职业技能有什么 09-15
- 三角洲行动步枪怎么改 步枪热门改枪方案整理分享 09-15