使用 CSS :is() 伪类可一次性匹配多个嵌套标签，避免重复书写选择器，大幅简化对 内 –、、 及自定义 – 等标签的样式定义，并轻松扩展 :hover 和 :active 状态。

使用 css `:is()` 伪类可一次性匹配多个嵌套标签，避免重复书写选择器，大幅简化对 `chrome 98+/firefox 100+/safari 15.4+ 支持良好）

:is() 允许将多个选择器组合成一个简洁表达式，浏览器将其视为“任一匹配即生效”，且支持伪类和复合选择器。针对本例，可这样编写：

/* 基础状态：所有指定子标签统一样式 */
a > :is(h1, h2, h3, h4, h5, h6, strong, b, d1, d2, d3, d4, d5, d6) {
  font-weight: var(--medium);
  color: #333;
  transition: color 0.2s ease;
}

/* 悬停状态 */
a:hover > :is(h1, h2, h3, h4, h5, h6, strong, b, d1, d2, d3, d4, d5, d6) {
  color: #007bff;
  font-weight: var(--semibold);
}

/* 激活状态（点击时） */
a:active > :is(h1, h2, h3, h4, h5, h6, strong, b, d1, d2, d3, d4, d5, d6) {
  color: #0056b3;
  transform: scale(0.98);
}

? 关键说明：

• a > :is(...) 中的 > 是子选择器，确保仅作用于 <a></a> 的直接子元素，避免意外影响深层嵌套；
• :is() 内部无需空格分隔，各标签名用逗号分隔即可；
• :is() 支持任意合法选择器，包括类名（.highlight）、属性选择器（[data-emphasis]）甚至其他伪类（但注意层级逻辑）；
• 若需兼容旧版浏览器（如 IE 或早期移动端），可借助 PostCSS 插件 postcss-is-pseudo-class 自动展开为兼容写法。

? 进阶提示：
若 <d1>–<d6></d6></d1> 是语义化自定义元素（Web Components），建议同时为其定义默认样式，并配合 :where()（权重为 0）实现更灵活的样式覆盖策略。但对本场景，:is() 已是最简、最直观、最符合现代开发实践的解决方案。

从此告别 28 行重复代码——一行 :is()，清晰、健壮、可维护。