在 CSS 中,復合選擇器是由多個簡單選擇器組合而成的。常見的復合選擇器類型包括:
后代選擇器:用一個空格隔開的兩個簡單選擇器,表示匹配一個元素的后代元素。例如:.parent .child {}。
子元素選擇器:用一個大于號(>)隔開的兩個簡單選擇器,表示匹配一個元素的子元素。例如:.parent > .child {}。
相鄰兄弟選擇器:用一個加號(+)隔開的兩個簡單選擇器,表示選取緊接在另一個元素后的元素。例如:.first + .second {}。
通用兄弟選擇器:用一個波浪號(~)隔開的兩個簡單選擇器,表示選取與另一個元素有相同父元素、在其后面的所有同級元素。例如:.first ~ .second {}。
屬性選擇器:根據(jù)元素的屬性和屬性值來選擇元素。例如:a[target='_blank'] {}。
偽類選擇器:根據(jù)元素的狀態(tài)或位置來選擇元素。例如::hover {}。
偽元素選擇器:用于向某些選擇器的特定部分添加修飾效果。例如:::before {}。
這些復合選擇器可以通過組合使用來更精確地選擇特定的元素。例如可以使用 .parent .child:first-child {} 來選擇父元素中第一個子元素。