HTML5学习_day13(2)--nth-child(n)伪类选择器(多标签时不通过id,class来快速选中标签)

nth-child

作用:可以不通过id,class来快速选中标签

用法:
 
1
2
3
4

可以通过
div:nth-child(2)
来快速选中第二个div
nth-child(n):n可输出正整数,代表选中第几个

控制第8个元素的样式

div:nth-child(8){

color: red;

}

注意:第八个元素若不是div标签  那没有选中 选择第几个元素时不管前面的元素的类型

同一个类型标签奇数位置的标签选中

div:nth-child(2n-1){

color: green;

}


同一个类型标签偶数位置的标签选中

div:nth-child(2n){

color: blue;

}

3的倍数位置nth-child(3n) 4的倍数nth-child(4n)



你可能感兴趣的:(HTML5零基础学习笔记)