【CSS】ant-design-vue 中，元素样式上的 :where(.css-1lzsqjc) 是什么

第一部分 css-1lzsqjc 是库生成的一个类，防止样式冲突

第二部分 :where() 是什么东西

:where() 是 CSS 选择器的一种，用于选择符合条件的元素。它允许你创建一个选择器，该选择器可以匹配多个元素，并且这些元素的样式会根据选择器中的条件进行应用。

但是它不计入整体选择器的优先级，方便我们覆盖样式

:where()

:where(div, p) :where(div, p) a {
    color: red;
}

// 等于

div div a,
div p a,
p div a,
p p a {
    color: red;
}

:is()

:is(div, p) :is(div, p) a {
    color: red;
}

// 等于
div div a,
div p a,
p div a,
p p a {
    color: red;
}

:where() 和 :is() 的区别

:where() 不计入整体选择器的优先级

下边这种情况，颜色还会是 green，因为 :where() 不计入整体选择器的优先级

div p a {
    color: green;
}

:where(div, p) :where(div, p) a {
    color: red;
}

:is() 会计入整体选择器的优先级

下边这种情况，颜色是 red，因为 :is() 会计入整体选择器的优先级

div p a {
    color: green;
}

:is(div, p) :is(div, p) a {
    color: red;
}