CSS中經常使用 修飾符來指定選擇器的特定狀態。例如,在鼠標懸停在網頁元素上時,可以使用 :hover 選擇器來改變元素的樣式。
button:hover { background-color: blue; color: white; }
這段代碼將在鼠標懸停在按鈕上時將其背景顏色設為藍色,文字顏色設為白色。
除了 :hover 選擇器之外,還有其他很多常用的修飾符:
- :active - 當網頁元素被激活(例如被點擊)時應用樣式。
- :focus - 當網頁元素獲得焦點(例如通過鍵盤按鍵)時應用樣式。
- :nth-child() - 選擇某個父元素下指定位置的子元素并應用樣式
- :first-child - 選擇某個父元素下的第一個子元素并應用樣式。
li:nth-child(odd) { background-color: lightgray; }
這段代碼將選擇某個列表中的每個奇數位置項并將其背景顏色設為淺灰色。
通過使用修飾符,可以設計更加豐富、交互性強的網頁。