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

课程

/前端开发

/HTML/CSS

/初识HTML(5)+CSS(3)-升级版

improtant 与类选择器的权值问题

http://img1.sycdn.imooc.com//57b1c89b0001d7bc14880374.jpg

如图，两个css，一个是important的标签选择器，一个是类选择器。

按道理important的权值应该大于除了内嵌式的其他所有css，然而，图中的p .first类选择器的权值大于important。这是何解？谁来解释一下

另外 两句语言上下对调结果相同，说明是权值不同而不是先后顺序引起的

韶楠

2016-08-15

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

关注问题 我要回答
1594
操作
收起

正在回答

3 回答

墨小漓
2016-08-29

第二段中的first如果继承p{color:red!important;}的颜色简单二字就是红色，而且继承过来的话权值就0.1了。而你p .first{color:green;}权值为1+10=11，颜色有权值大的决定，所以是绿色。

2 回复 有任何疑惑可以回复我~
收起回答
韶楠 提问者
2016-08-15

http://img1.sycdn.imooc.com//57b1cc280001860314930364.jpg


p{color:red!important;}
.first{color:green;}

效果依旧

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

墨小漓

( ╯□╰ )，不好意思啊，这两天消息太多，小白没注意到你的回复。
2016-08-29 回复 有任何疑惑可以回复我~
韶楠 提问者
2016-08-15

把important去掉，显示结果依旧。important没起作用

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

韶楠 提问者

哪位大神给解答一下啊。我明白不加important，即代码为 p{color:red;} p .first{color:green;} 的时候显示效果还是这个的原因是p .first作用为让p的后代中所以带有first类的文字变绿色，而第一段中p的后代span不是first类，所以第一段全红，第二段只有"简单"二字为绿色。 但是我不明白的是加入important之后应该优先执行带有important的语句，不应该执行p .first啊，为何还是执行了
2016-08-15 回复 有任何疑惑可以回复我~
#2

墨小漓 回复 韶楠 提问者

哈哈，大神没有来，不过小白应该看出了你的问题。看你的body中的第一段中的类选择器first，其实并没有继承。<p class="first">...</p>,你只是给第一段的p标签定义了一个别名，继承应该是写在p标签内部的。<p id="second"> <span class="first"></span> </p>，你的第二段的first写在了p的内部，所以才有继承一说。SO，原因你懂的。
2016-08-16 回复 有任何疑惑可以回复我~
#3

韶楠 提问者 回复 墨小漓

首先，感谢你的回答。 你的回复我看懂了，我说的也是是这个意思的。p .first{color:green;}在第一段没有起作用。 我的问题是，加入important后，“p{color:red!important;}”这句代码权值更重，应该让“p .first{color:green;}”失效，造成所有文字全红色的效果。但是结果是“p .first{color:green;}”依然起作用，简单二字依然绿色，你能明白我的意思吗？
2016-08-16 回复 有任何疑惑可以回复我~
#4

墨小漓 回复 韶楠 提问者

你这说法不对。还是继承问题呀，你第二段中的first如果继承p{color:red!important;}的颜色的话简单二字就是红色吧，但是继承过来的话权值就0.1了。而你p .first{color:green;}权值为1+10=11，颜色有权值大的决定，所以是绿色。are you ok?
2016-08-16 回复 有任何疑惑可以回复我~
#5

韶楠 提问者 回复 墨小漓

终于get到了。 hello thank you thank very much
2016-08-18 回复 有任何疑惑可以回复我~
#6

墨小漓 回复 韶楠 提问者

哈哈，有些问题想通了其实都是很简单的，一起努力哦。
2016-08-19 回复 有任何疑惑可以回复我~
#7

韶楠 提问者 回复 墨小漓

好的 多谢你了！忙了两天，丢下好多，抓紧补上！
2016-08-22 回复 有任何疑惑可以回复我~
#8

韶楠 提问者 回复 墨小漓

貌似 我没办法采纳你为最佳答案，好像是要直接回复才行，麻烦你复制一下粘过去，(*^__^*) 嘻嘻……
2016-08-22 回复 有任何疑惑可以回复我~
查看5条回复

举报

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

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

进入课程

本课相似问答

7 回答类选择器与子选择器

1 回答自选择器的权值

4 回答子选择器的权值

3 回答课题疑问 、选择器权重值

3 回答权值，类选择符，ID选择符
搜索更多本课相关问答

improtant 与类选择器的权值问题

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