来源:自学PHP网 时间:2015-04-14 14:51 作者: 阅读:次
[导读] 1、ID 选择符 类选择符 元素选择符,特指度高的优先级高2、行内样式 内嵌样式 链接样式3、设定的样式 继承的样式特指度的计算:特指度可以用一个公式 I-C-E 来计算,其中I 是 I...
1、ID 选择符 > 类选择符 > 元素选择符,特指度高的优先级高 2、行内样式 > 内嵌样式 > 链接样式 3、设定的样式 > 继承的样式
特指度的计算: 特指度可以用一个公式 I-C-E 来计算,其中 I 是 ID C 是 Class E 是 Element 对于一个 CSS 规则,若选择符中有一个 id,则 I 的值 +1;若选择符中有一个 class ,则 C 的值 +1;若选择符中有一个 element,则 E 的值 +1。 最后,从 I 的值开始比较,比较的规则如下伪代码所示: if(a.I > b.I){ a 的优先级高 } else if(a.I < b.I){ b 的优先级高 } else{ if(a.C > b.C){ a 的优先级高 } else if(a.C < b.C){ b 的优先级高 } else{ if(a.E > b.E){ a 的优先级高 } else if(a.E < b.E){ b 的优先级高 } else{ if(a 先于 b 出现){ b 的优先级高 } else{ a 的优先级高 } } } } 例如:
如上例子所示,虽然 greenText 的设置是在后面,但并没有覆盖前面的样式,最后的结果是两个文本都是红色的 我们计算一下两个样式的特指度: 1、#redText p 这个选择符中出现了一次 ID 和一次 Element,所以特指度是 1-0-1 2、#greenText 这个选择符中只出现了一次 ID,所以特指度是 1-0-0 所以第一个的优先级高,不会被后者覆盖
|
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com