我有输入文字
<input type="text" class="name">
有人可以解释为什么这个ccs角色
input[type="text"], input[type="search"], input[type="password"] {
background: none repeat scroll 0 0 #FFFFFF;
}
覆写
.name{background:yellow}
不管css文件中的顺序(谁先出现)。
但是如果我指定父亲的班级的名称,则覆盖是相反的
例如
.form .name {
background:yellow
}
覆盖这个
input[type="text"], input[type="search"], input[type="password"] {
background: none repeat scroll 0 0 #FFFFFF;
}
谢谢
巴罗兹
最佳答案
我非常喜欢此规则(引用此wonderful article中的引号)来衡量选择器的特异性:
计算选择器(= a
)中ID属性的数量。数一下
选择器(= b
)中其他属性和伪类的数量。
计算选择器中元素名称和伪元素的数量
(= c
)。将三个数字a-b-c
串联起来可得出特异性
对于.name
选择器,它只是0-1-0
-仅是一个类名。
对于.form .name
,它是0-2-0
-两个类名。
对于input[type="text"]
,它是0-1-1
,因为属性选择器与元素名称结合在一起。显然,它比0-1-0
更具体,但小于0-2-0
。 )