如何在CSS中設定除最後一個孩子之外的所有孩子的樣式？

使用CSS 選擇除最後一個子元素之外的子元素

在Web 開發中，特別是使用CSS，可能存在您想要套用的情況會為元素的所有子元素設定樣式（最後一個子元素除外）。這可以使用 CSS 選擇器等級 3 的否定偽類來實現。

語法：

:not(:last-child) { /* styles */ }

工作原理：

:not() 偽類允許您排除與指定選擇器匹配的元素。在本例中，我們使用它來否定 :last-child 偽類，該偽類選擇最後一個子元素。

範例：

考慮以下HTML 結構:

<div>
  <div>First child</div>
  <div>Second child</div>
  <div>Third child</div>
</div>

要設定除最後一個子元素之外的所有子元素的樣式，您可以使用以下CSS：

:not(:last-child) {
  background-color: blue;
}

這會將藍色背景顏色應用於前兩個子元素，但不會第三個孩子。

相容性：

值得注意的是，:not() 偽類在 Internet Explorer 8 或更早版本的瀏覽器中不受支援。

以上是如何在CSS中設定除最後一個孩子之外的所有孩子的樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！