后代选择器
.类名选择器 .类名选择器 ---->找到box1下面的demo类名
.box1 .demo{
color: gold;
}
.类名选择器 p ---->直接找到box1下面的p标签
.box1 p {
color: red;
}
<div class="box1">
<ul>
<li><p class="demo">阿士大夫撒旦</p></p></li>
<li><p class="dede">afsdfsdfsadfs</p></li>
<li><p>阿斯顿发斯蒂芬</p></li>
<li><p>士大夫士大夫撒旦法撒旦法士大夫</p></li>
<li><p>撒旦法她问他we</p></li>
</ul>
</div>
交集选择器
p.ppp{
color:red;
}
.box1 p.pp{ 后代交集选择器
color:green;
}
<div class="box1">
<p class="pp ps">适得府君书公司的</p>
<p class="pppp">sadfsdfsadf阿斯顿发斯蒂芬</p>
<p class="ppp">撒发送到发斯蒂芬斯蒂芬sadfsdfsadf阿斯顿发斯蒂芬</p>
</div>
<div class="box2">
<p class="pp ps">适得府君书公司的</p>
<p class="pppp">sadfsdfsadf阿斯顿发斯蒂芬</p>
</div>