CSS3樣式選擇符是用來選擇元素并設置樣式的一種方法。常見的樣式選擇符有以下幾種:
/* 選擇元素標簽 */ p { color: red; } /* 選擇元素類名 */ .article { font-size: 16px; } /* 選擇元素ID */ #header { background-color: blue; } /* 選擇子元素 */ nav ul li { display: inline-block; } /* 選擇后代元素 */ .container p { margin-bottom: 10px; } /* 選擇相鄰元素 */ h1 + p { font-size: 18px; } /* 選擇兄弟元素 */ h2 ~ p { color: grey; }
樣式選擇符可以單獨使用,也可以組合使用。例如,nav ul li
選擇的是nav下的ul下的li元素,而.article p
選擇的是class為article的元素下的所有p元素。選擇符的優先級可以通過權重值進行計算,優先級高的樣式會被應用。
當需要對不同狀態的元素設置不同樣式時,常常會使用偽類選擇符。例如,a:hover
可以在鼠標懸停時為鏈接添加樣式,input:disabled
可以為禁用狀態的輸入框添加樣式。
總之,CSS3樣式選擇符是網頁設計中必不可少的一部分,它可以讓我們更好地控制元素樣式,實現更好的網頁設計效果。