CSS中的偽類是指不屬于文檔樹中節點,而是在選取樹中匹配某些狀態的一類選擇器。最常用的就是目標偽類選擇器,即:hover,:active和:focus。以下是它們的用法:
:hover{ /* 在元素被鼠標指針懸停時應用樣式 */ color: red; } :active{ /* 當元素被激活時應用樣式 */ background-color: yellow; } :focus{ /* 當元素成為輸入焦點時應用樣式 */ box-shadow: 0 0 5px blue; }
例如,在上述代碼中,當鼠標懸停在某個元素上時,它的文本顏色將變為紅色,當元素被單擊時它的背景顏色將變為黃色,當元素獲取焦點時,它將被放置在一個藍色的陰影框中。
除了這些常用的目標偽類選擇器之外,還有一些其他的選擇器可以用來匹配特定的元素狀態。例如,:first-child可用于選取父元素下的第一個子元素,:nth-child(n)可用于選取父元素下的第n個子元素(n從1開始),:nth-of-type(n)可用于選取父元素下特定類型的第n個子元素。
在CSS中,偽類選擇器可以輕松實現一些在JavaScript中需要編寫復雜腳本才能實現的效果,同時也允許開發人員自定義和控制頁面元素的行為和樣式,從而實現更好的用戶體驗。