CSS组合选择器

CSS 连接符

一个连接符是两个选择器之间的解释

一个CSS选择器可以包含多个简单选择器。简单的选择之间，我们能有一个连接符。

在CSS3中有四种不同的连接符:

后代选择器匹配指定元素后代的所有元素

下面的实例选择包括在<div>元素中的所有<p>元素。

div p {
    background-color: yellow;
}

子选择器选择指定元素的直接子元素的所有元素。

下面实例选择所有<div>元素的直接子元素 <p>

div > p {
    background-color: yellow;
}

相邻兄弟选择器选择指定元素的相邻兄弟的所有元素。

兄弟元素必须具有相同的父元素，而“相邻”意味着“立即”跟随。

下面实例选择<div>元素后面的所有相邻兄弟元素<p>

div + p {
    background-color: yellow;
}

一般兄弟选择器选择指定元素兄弟的所有元素。

下面实例选择<div>元素的所有兄弟元素<p>

div ~ p {
    background-color: yellow;
}