.example .pp{ color: orange; } .example.pp2 { color: green; }
如上面的两个定义一个是中间有空格,一个是中间没空格。
第一个class要这样写生效:<p class="example">文字文字<span class="pp">pp这个class生效</span>....</p> 第二个class要这样写生效:<p class="example pp2">pp2这个class生效</p>
-
.example .pp
=E F
是后代选择器。 -
.example.pp2
则是在一个元素上,这个元素包括这两个类才会有效果。
.example .pp
中间用空格隔开,表示后代选择器,选择的是.example
内的.pp
。