如何防止 CSS 颜色属性从父项 class 应用到子项 classes

Question

我只想使用父 class 名称在 child1 class 中添加 CSS。我试过这段代码，但是 CSS 被添加到 child1 的所有子 classes 中。我不想在 child1

的子 class 中添加 CSS

.root .child1 {color: red;}

<div class="root">
  <div class="child1">Hi I am child1 of root
    <div class="child12">child2</div>
  </div>
</div>

Answer 1

要防止 child classes 获得 parent class 颜色，请使用以下 CSS

.child1 * {
  color: black;
}

* 选择 .child1

的 children 的所有元素

如果只想防止parentclass的直接child可以使用下面的css

.child1 > * {
  color: black;
}

    .root .child1 {
 background-color: red;
}

.root .child1 div{
  background-color: white;
}

<div class="root">
  <div class="child1">Hi I am child1 of root
    <div class="child12">child2</div>
    <div class="child13">child3</div>
    <div class="child14">child4</div>
  </div>
</div>

如何防止 CSS 颜色属性从父项 class 应用到子项 classes

How to prevent CSS color property applied from parent class to child classes

css

parent-child

如何防止 CSS 颜色 属性 从父项 class 应用到子项 classes

How to prevent CSS color property applied from parent class to child classes

css

parent-child

如何防止 CSS 颜色属性从父项 class 应用到子项 classes