CSS3提供了許多強大的偽類和偽元素,它們可以大大增強CSS樣式的靈活性和表現力。
偽類是指在某些特定的狀態下,如:hover、:active、:visited等等,給HTML標記設置樣式,而不是改變HTML文檔本身的內容。下面是一些常用的偽類:
/* 懸停狀態下的鏈接 */ a:hover { color: red; } /* 點擊后的鏈接 */ a:active { color: blue; } /* 已訪問的鏈接 */ a:visited { color: purple; }
偽元素則是用于對特定的HTML元素添加一些虛擬的元素和內容,可以實現一些特殊效果。下面是一些常用的偽元素:
/* 在元素的前面插入一些內容 */ ::before { content: "前面插入的內容"; } /* 在元素的后面插入一些內容 */ ::after { content: "后面插入的內容"; } /* 第一個字母加大寫效果 */ ::first-letter { font-size: 1.5em; color: red; }
CSS3的偽類和偽元素非常強大,可以在很多場景下用于優化用戶體驗,但需要注意的是,一些老舊的瀏覽器可能不支持它們,需要在使用時進行兼容性考慮。
上一篇css3偽類動畫
下一篇mysql查詢數據前兩位