CSS中定义CLASS类别时空格和不带空格的区别

本文主要介绍css选择器中带空格、不带空格的具体区别。

1、如果css类选择器带空格

.foot .pp{ color: green; }

带空格的话，被称为后代选择器，那么对应的html代码要这样写才生效

<p class="foot">文字文字
<span class="pp">pp这个class生效</span>
</p>

2、如果css类选择器不带空格

.foot.pp2 { color: green; }

那么对应的html代码要这样写生效，class属性上面同时有foot和pp2，用空格隔开

<p class="foot pp2">
pp2这个class生效
</p>

一般是要语义化的写CSS样式，所以会在定义class的时候加空格。

另外拓展一下，会存在下面和上面类似的情况，带逗号的

.ee,.ff 代表 class='ee' 和 class='ff' 都会被选择上。

<div class="ee"></div>
<div class="ff"></div>

以上就是css定义class属性时，带空格和不带空格的区别。