课堂例子问题

Question

p span.warning{color:purple;} 这句话不理解 p span 是包含选择器 后面直接跟上类选择器是什么意思呢？

Answer 1

上面的逻辑关系是这样的

<p>

    <span class="warning">123</span>

</P>

Answer 2

p的一个类名为warning的span亲儿子

Answer 3

这是后代和类结合选择器。

p span.warning{}即选择p元素下的包含warning类的span元素。HTML结构是这样的

<p>
    <span class="warning">我是类结合选择器</span>
</P>