Question

我有两个div元素：

  <div  class = "clsdiv1">Hello</div>
  <div  class = "clsdiv2">Bye</div>

和那些css类：

.clsdiv{
  background: red;
}

.clsdiv1 {
  background: black;
  border: 2px solid black;
}
.clsdiv2 {
  background: green;
  border: 2px solid white;
}

我希望clsdiv1和clsdiv2从clsdiv类继承背景颜色，所以我这样实现：

.clsdiv1 .clsdiv{
  background: inherit;
  border: 2px solid black;
}
.clsdiv2 .clsdiv{
    background: inherit;
  border: 2px solid white;
}

但继承不起作用，知道我缺少什么？为什么遗产不起作用？

Answer 1

是的，您没有引用应该在元素上继承的类名。如果要使其适用于当前的CSS，可以使用以下标记：

<div  class = "clsdiv clsdiv1">Hello</div>
<div  class = "clsdiv clsdiv2">Bye</div>

您甚至不需要继承背景颜色，因为它已经设置为相同的元素：

.clsdiv {
    background: red;
}
.clsdiv1 {
    border: 2px solid black;
}
.clsdiv2 {
    border: 2px solid white;
}

另一方面，这样的设置与继承无关......

Answer 2

嗯，你正以错误的方式接近它。

<div  class = "clsdiv">Hello</div>
<div  class = "clsdiv">Bye</div>

.clsdiv{
  background: red;
}

如果你想让两个div都有红色背景给他们相同的类

css继承类不起作用

2 个答案: