定義和用法

:nth-child(n) 選擇器匹配屬于其父元素的第 N 個子元素，不論元素的類型。

n 可以是數(shù)字、關(guān)鍵詞或公式。

CSS3中有一個神奇的玩意，可以輕松選取你想要的標簽并給與修改添加樣式，是不是很給力，它就是“:nth-child”。

下面我將用幾個典型的實例來給大家講解:nth-child的實際用途：

Tips：還用低版本的IE瀏覽器的哥們請繞過！

.demo01 li:nth-child(2){background:#090}

點此查看實例展示

.demo01 li:nth-child(n+4){background:#090}

點此查看實例展示

.demo01 li:nth-child(-n+4){background:#090}

點此查看實例展示

.demo01 li:nth-child(2n){background:#090}

點此查看實例展示

.demo01 li:nth-child(2n-1){background:#090}

點此查看實例展示

.demo01 li:nth-child(3n+1){background:#090}

點此查看實例展示

.demo01 li:last-child{background:#090}

點此查看實例展示

.demo01 li:nth-last-child(3){background:#090}

ok，:nth-child的這些用法在實際中很用得著，不用單獨給需要選取的標簽加上ID或Class，是不是很拉風！

上一篇：學好js，這些js函數(shù)概念一定要知道

下一篇：HTML5語義化總結(jié)