我可以针对所有带有单个选择器的标签？

小编典典

all

我想定位页面上的所有 h 标签。我知道你可以这样做…

h1,
h2,
h3,
h4,
h5,
h6 {
  font: 32px/42px trajan-pro-1,trajan-pro-2;
}

但是有没有更有效的方法来使用高级 CSS 选择器呢？例如：

[att^=h] {
  font: 32px/42px trajan-pro-1,trajan-pro-2;
}

（但显然这不起作用）

阅读 90

2022-07-13

共1个答案

小编典典

新的:is()CSS 伪类可以在一个选择器中完成。

例如，您可以通过以下方式定位容器元素内的所有标题：

.container :is(h1, h2, h3, h4, h5, h6)
{
    color: red;
}

大多数浏览器现在都支持:is()，但请记住，大多数 2020 年之前制作的浏览器不支持不带前缀的，因此如果您需要支持较旧的浏览器，请谨慎使用。

在某些情况下，您可能希望使用:where()伪类，它非常类似于:is()但具有不同的特异性规则。

2022-07-13