本次总结的几种基础选择器，是使用之前的选择器，id选择器，类选择器所组合出来的。
一、父子选择器/后代选择器
示例：div strong em{}
含义：选中div中所有的em元素
三个选择器间使用空格分离。如下图，div中凡是为em的后代会全部选中，无论是儿子还是孙子都会被选中。
<div>
<strong>
<em>父子选择器<em>
</strong>
</div>
<em>父子选择器</em>
div strong em{
color:rde;
}
二、直接子元素选择器/子代选择器
示例：div>em{}
含义：选择div中所有子元素em
两个选择器之间用 > 分离。在下图中，如果我们并不想让选中div以外的em，而只是想选中儿子一辈，就要用到直接子元素选择器 →div>strong>em
<div>
<strong>
<em>直接子元素选者器</em>
</strong>
<em>单独显示选</em>
</div>
div>strong>em{
color:#ffffff
}
div>em{
color:#0000ff
}
三、并列选择器/交集选择器
含义：选择div中所有class‘并列选择器1’的元素
<div>
<div>1</div>
<div class="并列选择器1">2</div>
<div class="并列选择器1">2</div>
<div id="并列选择器1">2</div>
<p class="并列选择器2">3</div>
</div>
div.class并列选择器1{
color:#5c3317;
}
p.并列选择器2{
color:#5c7654;
}；
四、分组选择器/并集选择器
示例：div，p
含义：选择div和p标签内的元素。两个选择器之间用逗号隔开
<div>123</div>
<p>456</p>
div,p{
color:#00ff00;
}
五、常用的id选择器，就是根据id来添加样式。
示例：#id{}，id名前使用#号。
<div id="id1"></div>
#id1{
background-color:#000000;
}
}
六、类选择器
类选择器则是根据class名来添加样式，接下来给下面元素添加类名。同一个标签可以有多个类名，用空格分离；同一个类名也可以被添加给不同的标签
示例：.class{}
<div class="class1"></div>
.class1{
background-color:#ff2400;
}
