在 CSS 中,我們可以通過選擇器來針對某些元素進行樣式設置,如何對一個奇數個子元素進行樣式設置呢?這時我們就需要用到偽類選擇器來解決問題了。
/* 選擇某個元素的第奇數個子元素 */ :nth-child(odd) { /* CSS 樣式設置 */ } /* 選擇某個元素的第偶數個子元素 */ :nth-child(even) { /* CSS 樣式設置 */ }
上面這兩個選擇器分別可以選擇某個元素的第奇數個子元素和第偶數個子元素,我們可以通過它們來設置奇數個子元素的樣式。
例如,我們有一個含有 5 個 li 元素的 ul 列表,如果我們想設置其中第奇數個子元素的背景顏色為紅色,我們可以這樣寫:
/* 設置 li 元素中第奇數個子元素的背景顏色為紅色 */ li:nth-child(odd) { background-color: red; }
如上所示,我們使用了 :nth-child(odd) 選擇器來選擇 li 元素中第奇數個子元素,并設置其背景顏色為紅色。這樣就完成了奇數個子元素的樣式設置。