CSS：更改特定列中文本的颜色-但不更改该列标题上的颜色？

java12399900

我有下HTML表：

<div class="table">
            <table id="carTable">
                <tbody>
                <tr>
                    <th>Car Number</th>
                    <th>owner</th>
                </tr>
                <!-- {{#each car}} -->
                <tr>
                    <td>{{carNumber}}</td>
                    <td>{{owner}}</td>
                </tr>
                <!--{{/each}} -->
                </tbody>
            </table>
        </div>

并关联CSS了第一列中文本颜色的更改：

#carTable tr>:nth-child(1){
        font-weight: bold;
        color: #2d89ac;
    }

问题在于，这还会更改该列的表标题上的颜色。

我该如何阻止它？

约翰汉平

您可以:not()在CSS中使用规则：

#carTable tr>:nth-child(1):not(th) {
  font-weight: bold;
  color: #2d89ac;
}

<div class="table">
  <table id="carTable">
    <tbody>
      <tr>
        <th>Car Number</th>
        <th>owner</th>
      </tr>
      <!-- {{#each car}} -->
      <tr>
        <td>{{carNumber}}</td>
        <td>{{owner}}</td>
      </tr>
      <!--{{/each}} -->
    </tbody>
  </table>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。