css - 重置由父元素为模态设置使用的 CSS 属性

Question

我使用 Twitter Bootstrap 的alert功能来根据某些状态对 HTML 表格进行注释。在每个表格单元格中，还有一个模态窗口。模态窗口继承了<td>元素设置的 CSS 属性，使用alert*特性：

<td class="alert alert-block alert-success">
  <a>Modal Link</a>
  <div>Modal Content<div>
</td>

因此，当模态显示时，它实际上以alert由 parent 设置的 type 设置的颜色显示td。无论如何要重置 modal 的 CSS 属性div？

Answer 1

您可以编写一个样式<div>来覆盖所有为 .alert. 但是，我通常将模态框<div>放在<table>.

<table>
  ...
  <td class="alert alert-block alert-success">
    <a>Modal Link</a>
  </td>
  ...
</table>
<div>Modal Content<div>

模态<div>不会显示在里面，<td>所以把它放在那里没有意义。