Question

考虑以下几行代码：

<dd class="flt-block-content ">
  <ol>
    <li style="width: 50%;">
      <a href="ref">abc</a>
      <span class="count-wrapper">(6)</span>
    </li>
    <li style="width: 50%;">
      <a href="ref">def</a>
      <span class="count-wrapper">(16)</span>
    </li>
  </ol>
</dd>

如何使用自定义值覆盖位于名为width的类中的所有li标记的flt-block-content属性？

第二个问题：是否需要使用!important来覆盖？

Answer 1

如果您有内联样式并希望覆盖它，则需要使用!important来执行此操作。

.fit-block-content li {
    width: 100% !important;
}

Answer 2

首先，您使用的内联样式的特性大于id，class或element。所以他们会覆盖所有这3个样式。因此，为了拥有默认宽度然后覆盖，您可以创建一个类default并分配width:50%和一个类override并指定覆盖样式

li.default {
  width:50%
}

li.override {
  //Override styles
}

关于! important的第二个问题，除非在特定情况下需要，否则使用! important绝不是一个好习惯

CSS：覆盖居住在类中的li样式的属性

2 个答案: