html - 如何将 css 应用于类和 ID？

Question

我在 div 中有一个表格，CSS 提供给 tr with id="test"没有得到更新，当 td 的 css 被删除时它正在工作。如何在 css 中选择元素以及为什么样式未应用于 tr？

#divID .w3-table #test {
  background-color: blue
}

#divID .w3-table td {
  background-color: yellow
}

<div id="divID">
  <table class="w3-table">
    <tr>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Points</th>
    </tr>
    <tr id="test">
      <td>Jill</td>
      <td>Smith</td>
      <td>50</td>
    </tr>
    <tr>

  </table>
</div>

Answer 1

因为您将 css 应用到 TR 而不是 TD，所以 TD 也有背景色并且 TR 不再可见。我建议按如下方式做一些事情:

divID .w3-table td{background-color:yellow}
divID .w3-table #test td{background-color:blue}

在这种情况下，我们添加#test(以 tr 的 id 为目标)，然后在之后嵌套 td，这应该确保您的 css 按预期工作，因为您的实现以 tr#test 为目标，而 td 在 # 中仍然测试。

也最好稍后再进行 #test，因此它也可以通过最后一个进行覆盖，否则理论上黄色仍然可以应用，因为它是稍后定义的(覆盖)。