CSS3是CSS最新的版本,其中新增了許多強(qiáng)大的偽類。偽類可以讓我們在不改變HTML結(jié)構(gòu)的情況下,為元素增加樣式和功能。下面就是幾個CSS3新增的偽類舉例。
/* :not偽類 */ /* 用于選擇不匹配指定選擇器的元素 */ p:not(.first) { color: red; } /* :checked偽類 */ /* 用于選取選中的單選框或復(fù)選框 */ input[type="checkbox"]:checked { background-color: green; } /* :nth-of-type偽類 */ /* 用于選擇某一類型的子元素中的第n個元素 */ ul li:nth-of-type(2) { color: blue; } /* :nth-last-of-type偽類 */ /* 用于選擇某一類型的子元素中的倒數(shù)第n個元素 */ ol li:nth-last-of-type(2) { color: orange; } /* :first-of-type偽類 */ /* 用于選擇某一類型的子元素中的第一個元素 */ ul li:first-of-type { font-weight: bold; }
通過使用這些新增的偽類,我們可以更加方便地選取和改變特定元素的樣式和行為,從而打造出更加豐富多樣的頁面效果。
下一篇css3新出屬性