:first-child选择某个元素的第一个子元素；
:last-child选择某个元素的最后一个子元素；
:nth-child()选择某个元素的一个或多个特定的子元素；
:nth-last-child()选择某个元素的一个或多个特定的子元素，从这个元素的最后一个子元素开始算；
:nth-of-type()选择指定的元素；
:nth-last-of-type()选择指定的元素，从元素的最后一个开始计算；
:first-of-type选择一个上级元素下的第一个同类子元素；
:last-of-type选择一个上级元素的最后一个同类子元素；
:only-child选择的元素是它的父元素的唯一一个了元素；
:only-of-type选择一个元素是它的上级元素的唯一一个相同类型的子元素；
:empty选择的元素里面没有任何内容。
1.1、nth-child(n) 父元素下的第n个子元素，n必须大于0，索引都是从1开始。
<div>
<p>多云转晴</p>
<p>多云转晴</p>
<p>多云转晴</p>
<p>多云转晴</p>
<p>多云转晴</p>
</div>
div p:nth-child(2){
background: skyblue
}
1.2、nth-child(odd) 父元素下的奇数子元素 等同于 nth-child(2n-1)
div p:nth-child(odd){
background: skyblue
}
1.3、nth-child(even) 父元素下的偶数子元素 同样区分子元素类型 等同于nth-child(2n)
div p:nth-child(even){
background: skyblue
}
二、nth-of-type 匹配属于父元素的特定类型的第 N 个子元素的每个元素 忽略不是该类型的元素的存在
<div>
<h3>天气</h3>
<p>多云转晴</p>
<p>多云转晴</p>
<p>多云转晴</p>
<p>多云转晴</p>
<p>多云转晴</p></div>
div p:nth-of-type(1){
background: skyblue
}
文章来源于网络，望采纳
做前端一定要记住:nth-child(2)这个选择器，它可以帮你轻松选择你想要的标签并给与修改添加样式
下面通过几个例子说明，相信你一看就明白
:nth-child(2)表示选取第几个标签，”2可以是你想要的数字”
:nth-child(n+4)选取大于等于4标签，”n”表示从整数
:nth-child(-n+4)选取小于等于4标签
:nth-child(2n)选取偶数标签，2n也可以是even
:nth-child(2n-1)选取奇数标签，2n-1可以是odd
:nth-child(3n+1)自定义选取标签，3n+1表示”隔二取一”
:last-child选取最后一个标签
:nth-last-child(3)选取倒数第几个标签,3表示选取第3个
