第三行p后面加了空格之后第一段第二段都会变成绿色，为什么呢？
来源：9-4 为所欲为 - 选择器最高层级!important
暮女神
2016-10-31 15:20
<style type="text/css">
p{color:red!important;}
p.first{color:green;}
</style>
</head>
<body>
<h1>勇气</h1>
<p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<p id="second">到了三年级下学期时，我们班上了一节公开课，老师提出了一个很<span class="first">简单</span>的问题，班里很多同学都举手了，甚至成绩比我差很多的，也举手了，还说着："我来，我来。"我环顾了四周，就我没有举手。</p>
写回答
关注
5回答
-
- Robert_Langdon
- 2016-11-15 00:08:03
p.first相当于你给class="first”的p标签设置了样式，
p空格.first相当于p span,这就意味着你给span标签设置了样式，
p{...!important;}
p{...;}
span{...;} //!important只会影响p标签，不会影响span标签
-
- 拼命跑啊跑
- 2016-10-31 16:39:58
出现重复的意思了，所以代码会以后面的样式为准
-
- qq_秦明月丶_03317423
- 2016-10-31 15:49:45
这是因为出现了层叠，当有相同权重的样式存在时，会根据这些css样式的前后顺序来决定，处于最后面的css样式会被应用。
-
- cherish4070261
- 2016-10-31 15:38:24
p后加空格并不会出现你所说的情况，而是一二段文字都变为红色，因为第二行代码中p标签属性优先级自定义最高。
-
- 被迫的小太阳4179783
- 2016-10-31 15:31:36
加空格变包含选择器，对fist和second都起作用
初识HTML(5)+CSS(3)-升级版
HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义
1228524 学习 · 19002 问题
相似问题
为什么第二段不变绿呢？
回答 5
为什么滑倒第二段不会变色
回答 5