css选择器:nth-child(n)选择前几个元素

学习记录2 css选择器:nth-child(n)选择前几个元素
如：在项目中要实现如下效果

在三列布局中间加边框线，只使用border-right是不行的，三个div都会被选中，因此使用css选择器给前两个div进行添加样式，实现代码如下：

 .totalShow > div:nth-child(-n+2) {
      border-right: 1px solid #E4E7ED;
    }

其中 >大于号代表只选择下一代子元素 (-n+2) 代表选择前两个。

针对nth-child(n) 使用方法的总结：

1、:nth-child(1) 选择第一个子元素
2、:nth-child(-n+2) 选择前两个子元素
3、:nth-child(n+2) 选择后两个子元素
4、:nth-child(2n) 选择列表中为偶数的元素
5、:nth-child(2n-1) 选择列表中为奇数的元素
6、:nth-child(n+6):nth-child(-n+9) 结合使用，选择一列元素中的中间几个
举例为从第六个到第九个