CSS3有許多選擇器,可以有針對(duì)性地選擇子元素進(jìn)行樣式設(shè)置。子元素的選擇器包括:
1. 后代選擇器(space 或 ):用于選擇父元素下的所有后代元素,不論層級(jí)深度。 2. 直接子元素選擇器(>):僅選擇父元素下的直接子元素,不包括后代元素。 3. 相鄰兄弟選擇器(+):選擇與當(dāng)前元素相鄰的下一個(gè)兄弟元素。 4. 通用兄弟選擇器(~):選擇所有與當(dāng)前元素后面的兄弟元素,不論它們是不是相鄰元素。
下面是一些示例代碼:
/* 后代選擇器 */ div p { font-size: 16px; } /* 直接子元素選擇器 */ ul >li { color: red; } /* 相鄰兄弟選擇器 */ h2 + p { font-style: italic; } /* 通用兄弟選擇器 */ p ~ span { background-color: yellow; }
當(dāng)然,在實(shí)際應(yīng)用中,可以根據(jù)實(shí)際需求靈活地使用這些選擇器,達(dá)到更好的樣式設(shè)置效果。