CSS :is 选择器

实例

我们希望为包含 <p> 的标签设置颜色：

:is(p) { color: red; }

CSS 的 :is 伪类是一个通用选择器，它允许你将多个选择器组合在一起，以便在 CSS 规则中复用它们。

:is 伪类可以接收任何数量的选择器作为参数，并且返回这些选择器匹配的元素的并集。

1、组合元素类型选择器

:is(h1, h2, h3) {
    color: red;
}

这段代码将为所有的 h1、h2 和 h3 元素设置文本颜色为红色。

2、组合类选择器

:is(.highlight, .warning) {
    font-weight: bold;
}

这段代码将为所有具有 highlight 或 warning 类的元素设置字体加粗。

3、组合不同类型的选择器

:is(a[href^="https"], button[disabled]) {
    cursor: pointer;
}

这段代码将为所有以 https 开头的链接和禁用状态的按钮设置鼠标指针为指针形状。

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

选择器
:invalid	10.0	10.0	4.0	5.0	10.0

:is(selector1, selector2, ..., selectorN) {
    /* 样式规则 */
}