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

关于css,权值的问题,能解释一下吗?

eg:...  

<style> 

 *{ color:red;} 

 .blue{ color:blue;} 

 </style>   

 <body>  

<p class="blue">这里的文字<em>hello</em>

</p>  

</body> 

 ...  

为什么结果是“这里的文字”是蓝色,hello显示为红色?


正在回答

1 回答

因为之前的课程讲到,继承也有权值,但是很低,可以理解为最低,这里是权值关系是:类选择器>通用选择器>继承,所以出现:“这里的文字”是蓝色,hello显示为红色

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

王昱蘅 提问者

还是没明白。 它的过程是怎样的呢? 是不是通用选择器让<p>变红,<em>因为继承也为红;类选择器让<p>变蓝,<em>原本会继承,但是继承&继承权值相同,<em>里的颜色不变还为红? 请指点,多谢!
2017-06-16 回复 有任何疑惑可以回复我~
#2

小鑫窝_2020

首先,通用选择器让<p>标签以及<em>都变红 然后,因为类选择器权值大于通用,"这里的文字"会变蓝,因为<em>继承p,继承的权值最低,所以还是红的,你可以去segmentfault上搜css权值,好好学习一下
2017-06-16 回复 有任何疑惑可以回复我~
#3

王昱蘅 提问者

可不可以这样理解: 类选择器>通用选择器,<p class="blue">…<em>…</em> 是都变蓝,通用选择器权值比<em>继承高,所以<em>…</em>变红。 谢谢指导
2017-06-16 回复 有任何疑惑可以回复我~
#4

小鑫窝_2020

嗯,可以这样理解。
2017-06-16 回复 有任何疑惑可以回复我~
#5

王昱蘅 提问者 回复 小鑫窝_2020

我试过,最后结果和两个选择器的顺序无关,纯粹是谁权值大谁作用,对吧?
2017-06-16 回复 有任何疑惑可以回复我~
#6

小鑫窝_2020 回复 王昱蘅 提问者

是,权值决定的
2017-06-16 回复 有任何疑惑可以回复我~
#7

王昱蘅 提问者 回复 小鑫窝_2020

谢谢!
2017-06-16 回复 有任何疑惑可以回复我~
查看4条回复

举报

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

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

进入课程

关于css,权值的问题,能解释一下吗?

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