javascript - 从子元素覆盖祖 parent 的 css

Question

我有以下代码结构:-

<li class="container">
  <div class="wrap">
    <div class="green">...</div>
  </div>
</li>


<li class="container">
  <div class="wrap">
    <div class="xyz">...</div>
  </div>
</li>


..
.. so on

现在 li 有以下 css :-

margin-top:35px

我不想为包含 green 类的 li 继承上述边距，但我希望为 xyz 类继承它。

我试过在 css 中使用运算符 > 但它不起作用。

Answer 1

如果您不想将 margin-top:35px 应用(从父 li 继承)到 div.green 那么这里是解决方案

CSS

.green {
  margin-top:-35px;
}

HTML

<li class="container">
  <div class="wrap">
    <div class="green">...</div>
  </div>
</li>


<li class="container">
  <div class="wrap">
    <div class="xyz">...</div>
  </div>
</li>