网页css选择器,web前端开发css
总觉得自己的CSS很别扭~ ~ ~，入职后决心加强。以前学CSS多是看实用的书，比如《精通CSS》，大多是技能。凭记忆~ ~发现自己这样的学习真的很弱，总是要跟着别人学。我觉得要想在某个领域做强，基本原则是必不可少的，于是有了我的第一篇关于CSS学习的文章。文章主要是根据《CSS权威指南》记录和整理了我的一些不靠谱的知识，发现真的是和这本书的一次相见恨晚。之前学CSS太浮躁，基础没打好。唉~ ~废话够多了，言归正传吧~
在选择器上，有一些特殊性和级联顺序规则需要熟悉。
选择器的特殊性：
选择器的特殊性是由其自身的组件决定的。特异性值用四部分表示，如0，0，0，0。选择器的具体特性确定如下：
ID属性值，加上0，1，0，0。
类属性值，属性选择或伪类，加0，0，1，0。
和伪元素，加上0，0，0，1。
共轭和通配符对特殊性没有贡献(即使没有贡献，也比继承值和浏览器默认样式优先级高)。通常，第一个0是为内联样式保留的。
级联规则：
按以下顺序确定级联规则：
找出元素匹配的规律。
按显示权重对所有匹配元素的声明进行排序！重要规则权重高于无！重要规则；
按来源对陈述进行分类，包括3个来源：创建者、读者和用户代理。创作风格优于读者风格。是啊！重要logo的阅读器风格比其他所有风格都强，包括！重要徽标的创建者样式。作者风格和读者风格都比用户代理的默认风格更强。
按特殊性对陈述进行排序，较高的特殊性胜出。
把申报单按顺序排好，最后一个就出来了。
葛坑
好了，先说个例子：测试p span { color:red }；行为：0，1，2，0。
这一次，我终于发挥了我一个研究生的研究精神，我想，这种底层估计是一点一点实现的吗？这样就可以只用一个数字来表示。
有猜测就要论证。怎么会？充分发挥我不要脸的结论导向证明的精神。假设浏览器用1位数表示特殊性，那么每个类别的特殊性肯定有一个上限，一般情况下不应该太大，所以我有以下代码来证明：
基本理念：
用id test给一个div元素添加一个样式规则，给这个元素添加一定数量的类，然后把这些类组合起来再给一个规则。如果一定数量的类规则覆盖了id规则，那么我的猜测就被证实了。
！声明文档类型
超文本标记语言
头
meta charset=utf-8 /
标题选择器演示/标题
meta name= copyright content= http://www . hualai . net . cn /
风格
#测试{
颜色：红色；
/风格
/头
身体
div id=test
这是一个带有id测试的div。
/div
添加的类别数量：
输入类型=text id=count /
type= button id= add value= add /
脚本
document.getElementById(add )。onclick=function() {
var t=document . getelementbyid( test )；
var count=Number(document . getelementbyid( count )。值)；
var cls=“”；
var CSS=“”；
//添加it count类，同时拼接CSS字符串
for(var I=0；我数；i) {
cls= t i
css=。t I；
CSS= { color:blue；}
t.className=cls
//插入规则
loadStyleString(CSS)；
//插入新的css规则
var loadStyleString=function(CSS){
var style=document . createelement( style )；
style . type= text/CSS ；
尝试{
style . appendchild(document . create text node(CSS))；
} catch(e) {//IE
style . style sheet . CSS text=CSS；
document . getelementsbytagname( head )[0]。appendChild(style)；
/脚本
/body
/html
在输入框中输入您想要添加课程的次数。JS代码会给div元素添加与次数对应的类，并插入相应的规则。代码中id规则是#test{color:red}，class规则是{color:blue}，所以如果结论正确，div的字体颜色会变成蓝色。
通过这个屌丝投机不懈努力的考验，发现255是一个分水岭。当超过255倍，即2的8次方时，二进制数为11111111。在chrome下，div的文字颜色变成蓝色，也就是增加的类是256倍时，特殊性变成1，0，0，0，等于ID属性的特殊性。因为最后一条规则，它赢了。
为了保持完整性，在主要浏览器中测试了以下内容：
FF13，chrome22，IE9(包括其环境中的IE7/8模式)和safira5，256个类带来的特殊性等于一个id的特殊性。而IETester中opera12、IE9、IE6/7中的怪异模式不会超出id的特殊性，所以推测它们分别是用数字保存的，而不是用一个数字位保存的。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。