css的选择器-逗号、空格分隔和连写的区别
1.连写
.a.b{background-color:pink;}
当两个元素名写在一起时,表示当前元素在html中同时出现才会出现效果,即
<div class="a b">hello</div>
2.逗号
.a,.b{background-color:pink;}
当两个元素名用逗号分隔时,表示当前元素在html中,出现其中一个就会出现效果,它们之间属于并列关系,即
<div class="a">hello</div><div class="b">hello</div>
3.空格
.a .b{background-color:pink;}
当两个元素名之间用空格分隔时,表示后代选择器,选择的是.a内的.b,只有当前的子元素才会出现效果,它们之间属于从属包含关系,即
<div class="a">hello1<div class="b">hello2</div></div>
补充:html中的class=“类名+空格+类名”,表示的是该元素同时拥有两个类