如何覆盖子 div 中的内联样式？

Question

我有两个 div 如下所示

<div class="parent">
  <div class="child">
  </div>    
</div>

现在在 child div 中，当我检查它时，我看到一个名为 height 的样式带有一些像素。我很惊讶它如何不适用于父 div。

我想将样式从 30px 改写为 100px。

我的应用程序是 angular 和 css3 html5、基于 Web api mvc 的应用程序。

怎么做？

我试过了

div[style] {
 height: 100px;
}

Answer 1

如果您说内联样式是动态插入的并且您不知道如何更改（您真的应该调试直到找出插入方式）然后比内联样式更具体，仅使用 !important

注意 这是应该使用 !important 的极端情况之一。否则 避免它

.child {
  background: red;
  height: 100px !important;
  width: 100px
}

<div class="parent">
  <div class="child" style="height: 30px">
  </div>
</div>

您可以查看我的回答，其中包含有关此主题的更多详细信息。