html - 将 CSS 规则仅应用于一个 HTML 表格？

Question

我在一个 html 页面上有 2 个表。

我只想删除其中一个的边框。

我目前的css是...

.table th, .table td {
     border-top: none !important;
 }

这也与表链接(我也有 Bootstrap ，我认为表类也与它链接？)

<table class="table">
<tbody>
    <tr>
        <th>1</th>
    </tr>
    <tr>
        <td>1</td>
    </tr> etc.....

所以在 CSS 中，我只想制定一条规则，不对我页面上的两个表格中的一个表格应用边框。但是我不知道该怎么做，因为它们使用的是同一个表类，并且不确定我是否需要多个规则？我试过使用父级选择器和 ID 选择器，但可能会用错。感谢大家!

Answer 1

您可以将唯一的类或 ID 添加到您想要在 CSS 中为该选择器设置样式和目标的任何表格。像这样:

HTML

<table class="table unique-name">
  ...whatever contents
</table>

CSS

.unique-name {
  // some styles.
}

---

更新

这是一个 Fiddle向您展示我在说什么。

请注意，分配给它的类 styled-table 的表有一些格式，而类 unstyled-table 的表没有格式。