CSS重写bootstrap表

Question

这是我的选择者：

table.table.table-striped.vitalStatisticsTable th,
table.table.table-striped.vitalStatisticsTable td {
  line-height: 1;
  padding: .4rem; 
  background-color: red;
}

这是我的标记：

<table class="table table-striped vitalStatisticsTable">
  <tr>
    <th scope="row">Education</th>
    <td>Post Graduate</td>
  </tr>
  <tr>
  <th scope="row">Vices</th>
    <td>Drinks socially</td>
  </tr>
  <tr>
    <th scope="row">Race</th>
    <td>White</td>
  </tr>
  <tr>
    <th scope="row">Pets</th>
    <td>George the turtle</td>
  </tr>
</table>

我的规则没有适用，但我不确定我做错了什么。我认为我必须增加特异性，据我所知，我比引导更具体，但也许我错过了一些东西。有人可以帮助css n00b吗？

Answer 1

好。实际上这确实有效。我的CSS文件中有一个额外的“}”。我同时感到羞愧和放心。

Answer 2

你可以用这个： table.vitalStatisticsTable th， table.vitalStatisticsTable td 这会奏效。所有课程都不需要在选择器中提及。