css组合符

css组合符：包括各种简单选择符的组合方式。

分类：后代选取器（以空格分隔），子元素选择器（大于号），相邻兄弟选择器（+），普通兄弟选择器（~）

（1）后代选取器：

div p{
background-color:yellow;
}

既属于div又属于p的区域。

（2）子元素选择器

div>p{
background-color:yellow;
}

注意：子元素只能作为某元素子元素的元素。例如上例中只有在div中的p元素起作用，如何还有其他元素将不起作用。比如

<div>
<span><p>I am fine, thank you! and you.</p></span>

</div>

（3）相邻兄弟选择器

可选择紧接在另一个元素后的元素，且二者具有相同的父元素。

div+p{
background-color:yellow;
}

上面将作用于所有位于<div>元素后的第一个p元素。

（4）普通相邻兄弟选择器

div~p{
background-color:yellow;
}

指定p元素但是不属于div元素内，并且仅作用于仅含有p元素的东西。