为了账号安全,请及时绑定邮箱和手机立即绑定

慕课评论水太深了。

我看到好几个回答别人的问题都理解的不对,怕是误人子弟了。

p{color:red;} /*继承权值0.1*/

.first{color:green;}/*类选择器权值高显示为绿色*/

span{color:pink;}/*元素标签1为粉色*/

p span{color:purple;}/*权值为2*/      

</style>

这样子理解对的吗?

后代选择器  和继承是两个概念吧

正在回答

5 回答

先比较范围若范围不一样则以小范围优先若范围一样比较权值 权值大优先 权值一样内联式优先

比如p>span这个子选择器的意义是p标签的第一代子标签<span>全为紫色我们先来看范围

这个p>span标签的范围和上面span的作用范围一样所以比较权值明显看出前者大所以为紫色

再看p和.first范围一样比较权值明显.first大所以整体为绿色

又因为span的作用范围小所以颜色不受大范围的标签控制

个人理解   错误请纠正


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

那个第一行权值不应该是1吗

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

在第一段中作用域p span<=span<.first<=p,局部作用域p span 等于span,但整体作用域p span小于span,.first与p同理,作用域相对小(权值大)的起作用(可理解为同一层级不同权值)。局部作用域相等,整体作用域相等或无法判定(可理解为同一层级同一权值)采用就近原则,个人理解


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

Gaberial

你理解是对的,,针对同一个元素才讨论权值/优先级高低,不针对同一个元素就看哪个定义的更加具体
2018-07-18 回复 有任何疑惑可以回复我~

.first{color:green;}的权值最高,为什么胆小如鼠是紫色,而不是绿色的呢?

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

Gaberial

哪里来的紫色。。
2018-07-16 回复 有任何疑惑可以回复我~
#2

慕仙5126391

有同样的疑问
2018-07-18 回复 有任何疑惑可以回复我~
#3

慕仙5126391 回复 Gaberial

p span{color:purple;}这里
2018-07-18 回复 有任何疑惑可以回复我~
#4

寻找真实的自己

权值关系还真不好理解
2018-07-18 回复 有任何疑惑可以回复我~
#5

Gaberial 回复 慕仙5126391

花了一天终于搞懂了。其实是这样的,针对同一个元素才讨论权值高低,比如练习中的.first和最先的p都是对p的颜色定义,这里针对同一个元素,而.first权值又比较高,所以是绿色;之后的span和p span都是定义span的颜色,针对同一个元素,而p span的权值显然比span高,2>1,所以最后span是紫色的。这其实是对不同区域的定义,前2段定义p,后2段定义span,所以最后整段是绿色的,但是胆小如鼠还是紫色,因为p span在最后特地对span进行了定义。
2018-07-18 回复 有任何疑惑可以回复我~
#6

胡叨叨的 回复 Gaberial

好的,谢谢啦
2018-07-19 回复 有任何疑惑可以回复我~
查看3条回复

对的,后代选择器是选择器的一种,而继承是把作用域范围比较大的作为父级.而作用域比较小的作为子级,如果子集的标签属性不与父级冲突,则会应用父级属性.

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

举报

0/150
提交
取消
初识HTML(5)+CSS(3)-升级版
  • 参与学习       1225794    人
  • 解答问题       18234    个

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

进入课程

慕课评论水太深了。

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信