CSS :has 选择器

完整CSS选择器参考手册

定义和使用

CSS 的 :has 伪类是一种选择器，它允许你根据其后代元素来选择一个元素。

:has 伪类在 CSS 选择器中非常有用，因为它可以基于更复杂的条件来选择元素。

• :has 伪类在 CSS 中是相对较新的功能，可能不被所有浏览器支持。在使用之前，建议检查浏览器的兼容性。
• :has 伪类不能与 * 选择器一起使用，它只能与类型选择器（如 div、span 等）或类选择器一起使用。

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

CSS 语法

parent:has(selector) {
    /* 样式规则 */
}

• parent：表示父元素的选择器。
• selector：表示你希望在父元素中找到的子元素的选择器。

更多实例

选择包含特定类名的元素

选择包含多个特定子元素的元素

以上代码将为同时包含 <li> 和 <div> 子元素的 <ul> 元素添加蓝色虚线边框。

完整CSS选择器参考手册