第一段字颜色为什么都变了，而去掉,#second 只变“胆小如鼠”？
.first,#second span{color:green;}
</style>
</head>
<body>
<h1>勇气</h1>
<p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<p id="second">到了三年级下学期时，我们班上了一节公开课，老师提出了一个很<span>简单</span>的问题，班里很多同学都举手了，甚至成绩比我差很多的，也举手了，还说着："我来，我来。"我环顾了四周，就我没有举手。</p>
踏浪前行浏览 1738回答 5
5回答
-
juan_zi
第一段字颜色变是因为你设置了：.first {color:green};所以第一段的字体就都变了去掉，#second之后就变成了 .first span{color:green}就相当于只对.first这个类里面的span标签设置了样式，所以只变“胆小如鼠“.first,#second span{color:green;}其实相当于 .first{color:green;}#second span{color:green;} -
WingMeng
要弄清这个问题，首先要理解CSS中的一个特性：“继承”。继承指内部的标签会拥有外部标签某些样式的性质，这些样式有color、font-size、font-family等。上面代码中的 p.first 和 p#second 包含有 span 标签，因此 .first,#second span{color:green;} 这句会让 p.first 整个段落的文字都变成绿色，包括其中的span （span继承了其父容器的color样式）；而第二段应用了#second span {color: green;}，是后代选择器，表示该样式只会应用在 #second 下的 span 标签，所以只有 #second 下的 span标签里的文字“简单”会变绿色。当你去掉 ,#second 后，CSS代码变为：.first span {color: green;}此时很明显这条样式只对 .first 下的 span 有效，不涉及第二段中的span，因此只有第一段中的“胆小如鼠”会变色。 -
赞果果
你是新手吧 ,新手先不要在一起设置属性!分开来写! -
慕客学渣会总瓢把子3201537
.first,#second span{color:green;}的意思是类选择器.first和#Idsecond 选择器的后代span变成绿色。你去掉,#second变成了： .first span{color:green;}类选择器的后代span变成绿色。 -
我就是伸手党
你说你写的是后代选择器还是分组选择器，不要自由发挥，这样没有什么可读性的。硬要解释的话，".first"和"#second span"构成一个分组选择器，其中"#second span"是个后代选择器，这才造成了你那样的结果。也没什么优先级可说的，别混着用就行了。
随时随地看视频慕课网APP
Html/CSS