...-慕课网

                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

.first{color:green;}权值最大，span{color:pink;}权值为1，那为什么显示的是粉红色呢？

feizq092

2014-07-18

源自：初识HTML(5)+CSS(3)-升级版 9-3

关注问题我要回答

12772

操作

收起

28 回答

八千流丶
2016-06-17

1. 内联样式表的权值最高 1000
2. ID 选择器的权值为 100
3. Class 类选择器的权值为 10
4. HTML 标签选择器的权值为 1
CSS 优先级法则：
A 选择器都有一个权值，权值越大越优先
B 当权值相等时，后出现的样式表设置要优于先出现的样式表设置
C 创作者的规则高于浏览者：即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式
D 继承的CSS 样式不如后来指定的CSS 样式
E 在同一组属性设置中标有“!important”规则的优先级最大
这是规定好的,自然不能打破

0 回复有任何疑惑可以回复我~

收起回答

好容易
2016-03-31

能不能来个明白人讲一下

0 回复有任何疑惑可以回复我~

收起回答

qq_空格_21
2016-01-08

我又来回答了p{color:red;}继承关系，.first{color:green;}是10权值中令第一段变成green绿色，而是1，中的文字也变成绿色而且是继承者（权值是0.1），所以span{color:pink}权值1，就可以变成粉色，所以，只有写上大于1的紫色就可以了，p span{}就是大于1的权值

0 回复有任何疑惑可以回复我~

收起回答

qq_空格_21
2016-01-07

掉人现眼了，答错了。sorry

0 回复有任何疑惑可以回复我~

收起回答

qq_空格_21
2016-01-07

.first{color:green;} 是10 > p{color:red;}是1，p span{color:pink}是1+1+10，所以12>10,

0 回复有任何疑惑可以回复我~

收起回答

小霸王i

p+span=12?你确定

2016-03-18 回复有任何疑惑可以回复我~

nihao_cong
2015-09-20

第七行 p{color:red;} 对于p来说，这条语句的权值为 1 ；而对于p中的span胆小如鼠来说，因为继承性，这条语句对于胆小如鼠来说只有 0.1 的权值。

第八行 .first{color:green;} 对于first来说，这条语句的权值为 10 ；而对于first中的span胆小如鼠来说，因为继承性，这条语句对于胆小如鼠来说只有 0.1 的权值。

第十行 span{color:pink;} 对于span胆小如鼠来说，这条语句的权值为 1 。

所以对于整段话来说（除了胆小如鼠外），执行第八行语句，因为第八行具有的权值最高为10>第七行的权值1，；而对于胆小如鼠来说，执行第十行语句，因为第十行语句具有的权值为1>第七行的权值0.1（第八行的权值）。

第十一行 p span{color:purple;} 对于p和span来说，这条语句的权值为1+1=2。那么现在对于p来说，就执行第十一行语句（第十行权值为2>第十行的权值1）。欢迎大家讨论。

49 回复有任何疑惑可以回复我~

收起回答

风早君418

我觉得你说的很对看到你的我才理解了，不过我觉得胆小如鼠应该改一下，的确执行的是第十行的语句，但是胆小如鼠是从红色变成绿色再变粉色的，因为第七、八、十行中“胆小如鼠”的权值都大于中“胆小如鼠”继承的权值。这只是我的理解，欢迎大家讨论纠错。

2016-05-28 回复有任何疑惑可以回复我~

风早君418

不过第十一行我倒不赞同你所说的，就算直接写span{color:purple;}，按照就近原则，也可以将“胆小如鼠”从粉色变为紫色，但是题目要求设置权值更高的，所以前面加个p即可。第一，不是对于p来说执行第十一行语句，而是对于“胆小如鼠”来说执行第十一行语句；第二，是因为p span权值=2大于继承的=0.1，而不是因为p span权值=2大于span权值=1。求各位大神纠错。

2016-05-28 回复有任何疑惑可以回复我~

大块吃肉188 回复风早君418

关于第二点，span还要考虑第10行时候span{color:pink;}权值是1，而继承的span权值是0.1吧。刚开始学了没几天也不知道说的对不对

2016-06-28 回复有任何疑惑可以回复我~