如何使 css class 从另一个 class 继承所有值而不更改原始 class

How do you make a css class inherit all values from another class without changing the original class

我正在尝试通过浏览器源将网站导入 OBS Studio。不幸的是,我正在导入的网站通过给网站的 html 元素设置为浅色主题 class tw-root--theme-light.

这可以通过将 class 更改为 tw-root--theme-dark 来轻松更改,但 OBS Studio 不允许您编辑 html。 我只能追加CSS.

是否可以覆盖 class tw-root--theme-light 以继承 tw-root--theme-dark 的所有值?

无法 以纯 CSS.

从另一个 class 继承所有值

CSS 继承是从父元素到子元素,这不适用于 CSS classes.

等规则集

我们可以使用 CSS 预处理器(例如 Sass 和 LESS)通过扩展 classes:

来实现这一点

Sass 中的示例(使用 SCSS 语法):

.block {
  display: block
}
.green {
  background: green
}

.green-block {
  @extend .block; // in LESS, the syntax would be the same but without @extend
  @extend .green; // in LESS, the syntax would be the same but without @extend
}

我只会使用那些 CSS classes 但用新的 CSS classes 覆盖您需要覆盖的所有样式。

如果您需要继承 CSS class 的所有样式,只需使用相同的 CSS class 两次,如有必要,创建一个新的 class 覆盖不需要的样式。