CSS 中可以使用组合选择器来同时选择两个或更多元素,从而实现对它们的样式规则的统一定义。常用的组合选择器有:
后代选择器:用空格分隔开两个元素,表示选择第一个元素的后代中符合条件的第二个元素。例如 div p 表示选择所有在 div 元素内部的 p 元素。
子元素选择器:用大于号 > 分隔开两个元素,表示选择第一个元素的子元素中符合条件的第二个元素。例如 ul > li 表示选择所有直接在 ul 元素下的 li 元素。
相邻兄弟选择器:用加号 + 分隔开两个元素,表示选择第一个元素后面紧跟着的符合条件的第二个元素。例如 h1 + p 表示选择紧接在 h1 元素后面的 p 元素。
通用兄弟选择器:用波浪号 ~ 分隔开两个元素,表示选择第一个元素后面的所有符合条件的兄弟元素。例如 p ~ span 表示选择所有与 p 元素在同一级且在 p 元素之后的 span 元素。
以上是 CSS 中常见的组合选择器,它们可以灵活应用,让我们在样式设计中更加方便。