css3选择器之:nth-child(n)和:nth-of-child(n)

:nth-child(n)和:nth-of-child(n)

:nth-child(n)

选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。

通俗一点的用法就是:nth-child(n) 表示谁的弟n个
比如li:nth-chidl(3) 表示页面的第三个li

也可以这样

	.div {
     
			width: 100px;
			height: 100px;
			background-color: #ccc;
		}
		div li:nth-child(3) {
     
			background-color: #f40;
		}

特殊的(奇数)

	div li:nth-child(odd) {
     
			background-color: #f40;
		}		

特殊的(偶数)

p:nth-child(even)
{
     
	background:#0000ff;
}

nth-of-type(n)

:nth-of-type(n) 选择器匹配属于父元素的特定类型的第 N 个子元素的每个元素.

其他同上

你可能感兴趣的:(css,css,高级选择器)