CSS偽類是一種為選擇器添加特殊效果的方法,可以使用偽類來對元素的某個狀態進行選擇和樣式的設置。以下舉例介紹一些常用的CSS偽類:
/* 鏈接偽類 */ a:link { /* 未點擊鏈接 */ color: blue; } a:hover { /* 鼠標懸停在鏈接上 */ color: red; } a:visited { /* 已訪問鏈接 */ color: purple; } /* 表單偽類 */ input:focus { /* 當前焦點輸入框 */ border: 1px solid blue; } input:disabled { /* 禁用輸入框 */ background-color: #eee; } /* 父元素偽類 */ ul:first-child { /* 第一個li元素的父元素ul */ margin-top: 0; } li:last-child { /* 最后一個li元素 */ border-bottom: 1px solid #ccc; } /* 狀態偽類 */ :checked { /* 選中狀態 */ background-color: orange; } :empty { /* 空元素 */ text-align: center; color: #999; }
注意:偽類以冒號(:)開頭,而偽元素以雙冒號(::)開頭,但古老的瀏覽器(比如IE6、IE7)不支持雙冒號表示偽元素,只能使用單冒號。
上一篇css偽類制作三角形
下一篇css偽標記選擇符