在CSS3中,偽類選擇器可以通過給元素添加一些特殊的效果,來更好地控制文檔的渲染。在這篇文章中,我們將會介紹CSS3中一些常用的偽類選擇器。
/* :hover偽類選擇器 */ a:hover { color: red; } /* :link與:visited偽類選擇器 */ a:link { color: blue; } a:visited { color: purple; } /* :active偽類選擇器 */ a:active { color: green; } /* :nth-child偽類選擇器 */ ul li:nth-child(3n) { background-color: lightblue; } /* :first-child與:last-child偽類選擇器 */ ul li:first-child { font-weight: bold; } ul li:last-child { font-style: italic; } /* :checked偽類選擇器 */ input[type="checkbox"]:checked { border: 2px solid green; } /* :disabled偽類選擇器 */ input[type="text"]:disabled { background-color: lightgray; }
以上這些偽類選擇器都是CSS3中比較常用的。使用它們可以方便地為文檔添加樣式和交互效果。當然,在實際開發中,還有很多其他的偽類選擇器,讀者可以自行探究。
上一篇css3底部彈出框
下一篇css 圖標動畫效果