CSS有一個(gè)非常實(shí)用的選擇器，可以很方便的選取除了最后一個(gè)子元素以外的其他所有子元素，它就是:not(:last-child)偽類選擇器。

父元素 :not(:last-child) {
/* 這里放 css 樣式 */
}

使用這個(gè)選擇器可以很輕松的實(shí)現(xiàn)很多效果。例如，如果我們希望一個(gè)列表的每一行都有一個(gè)灰色的底色，但是最后一行沒有底色，這時(shí)就可以使用:not(:last-child)偽類。

li:not(:last-child){
background-color: #ccc;
}

這樣就可以很容易的給一個(gè)長度不確定的列表添加灰色背景了。

還有一個(gè)應(yīng)用就是當(dāng)我們想要給一個(gè)列表的每一個(gè)元素都添加一些外邊距時(shí)，但是又不想給最后一個(gè)元素添加外邊距。這時(shí)候也可以用:not(:last-child)偽類選擇器把最后一個(gè)元素排除掉：

li:not(:last-child){
margin-bottom: 10px;
}

這樣就可以讓列表元素之間保持統(tǒng)一的外邊距，但是最后一個(gè)元素卻不受影響。

除了:last-child之外，還有很多其他的偽類選擇器可以幫助我們更加精確的選擇元素，比如:first-child選擇第一個(gè)子元素、:nth-child()選擇第 n 個(gè)子元素等。多加嘗試，你會(huì)發(fā)現(xiàn) CSS 的魅力無窮。