如何将CSS规则替换为其他类别

Question

例如，我有此CSS规则：

.dataList table {
  width: 100%;
}
.dataList table.onlyThisTables {
  width: 400px;
}

<div class="dataList">
  <table>
    <tr>
      <td>
        Content of this table
        <table class="onlyThisTables">
          <tr>
            <td>Content of this table
              <td>
          </tr>
        </table>
        </td>
    </tr>
  </table>
</div>

但始终在所有表中获取width:100%;，我想用400px宽度对.onlyThisTables类影响，我该怎么做？

Answer 1

这取决于您的HTML结构。您能说一个HTML代码的示例吗？答案可能是：

.dataList table {
width:100%;
}
.onlyThisTables {
    width:400px;
}

Answer 2

更新：

要解决您的更新问题，您可以使用!important后缀：

.dataList  table {
  width: 100%;
}
.dataList .onlyThisTables {
  width: 400px !important;
}

这是一个示例：https：//jsfiddle.net/lksv4dnd/

Answer 3

您需要在样式中指定max-width：

.dataList table {
  width: 100%;
}
.dataList table.onlyThisTables {
  width: 400px;
  max-width: 400px;
}