Question

我有以下问题：

我在CSS类中有给定样式的字体：

list

现在我有了一个CSS，可以在给定情况下给我一个div的大小：

l1 <- lapply(L, I) # I stands for identity.
l1[[2]][] <- 1
L[] <- l1
print(L[[1]][1,])
#[1] 0 0

我希望a_div_test具有font_arial_36的属性，例如继承。

类似的东西（仅张贴我想要的东西是错误的）：

.font_arial_36 {
    font-family:Arial;
    font-size:36px;
}

，现在.a_div_test也应该具有font_arial_36属性。

css是否可能？

PS：我不想像这样向HTML元素添加多个类：

.a_div_test {
    width:300px;
    max-width:350px;
}

因为我应该在.a_div_test出现的许多地方重写代码。

Answer 1

这在CSS中是不可能的。您要做的是将2个类分配给所需的元素。

<div class="font_arial_36 a_div_test"></div>

Answer 2

CSS代表“层叠样式表”。这意味着顶级元素会将其样式层叠到其子元素。只要.a_div_test元素包含在.font_arial_36的元素子树中，它们就会（继承）来自.font_arial_36的所有样式。

这就是为什么要在font-family标记内定义<body>的原因，以便将其应用于页面中的所有元素。

也就是说，继承是由HTML结构而不是CSS本身定义的。

Answer 3

当可以在HTML元素上添加带有空格的多个类时，为什么需要扩展。

<div class="font_arial_36 a_div_test">Like this</div>

Answer 4

如果您不想向html元素添加多个类，则

.font_arial_36, .a_div_test {
 font-family:Arial;
 font-size:36px;
}

.a_div_test {
  width:300px;
  max-width:350px;
}

除了这种在CSS中没有其他可能的继承方式外，我们必须使用sass

Answer 5

正如其他人所建议的那样，您无法将CSS属性继承到另一个属性。唯一的方法是将两个类都添加到DOM元素中以模仿继承。 CSS解决方案：

<button class="uiButton disabledButton">Click Here</button>

对于以下CSS：

.uiButton {
  background-color: gray;
  color: lightgray;
  font-size: 20px;
  font-family: "Segoe UI", Helvetica, sans-serif;
  text-align: center;
  text-decoration: none;

  padding: 10px 10px;
  border:none;
  display: inline-block;
  margin: 5px 5px;
  cursor: pointer;
}

.disabledButton
{
    background-color: gray;
    color: lightgray;
    cursor: not-allowed;
}

在上面：Button首先使用uiButton类设置样式，然后使用DisabledButton类设置样式。因此，无论您稍后在“ class”属性中编写哪个CSS类，都将覆盖较早版本的属性（以防万一）。

但是，有更好的方法：

是的，如果您准备使用https://sass-lang.com/guide

之类的CSS预处理器，

请注意，Sass是预处理器。这意味着，Sass文件（.scss）将被编译成CSS（但是chrome为.scss提供了很好的调试功能，即Sass文件）。您可以在SCSS文件中编写普通CSS，还可以使用指令来实现继承等等。为了使生活更轻松，有一些软件会在修改scss文件时自动创建css（我知道http://koala-app.com/会这样做）。

如何在CSS中继承？

5 个答案: