如果没有，则以不同方式设置表格的第一列的样式

Question

这就是我想要实现的目标：

这是我试图设计的标记：

  <h2>Table with no header</h2>
  <table>
    <tbody>
      <tr>
        <td>First column - bold</td>
        <td>Second column</td>
      </tr>
      <tr>
        <td>First column - bold</td>
        <td>Second column</td>
      </tr>
    </tbody>
  </table>

  <h2>Table with a header</h2>
  <table>
    <thead>
      <tr>
        <th>Header</th>
        <th>Header</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>First column - not bold</td>
        <td>Second column</td>
      </tr>
      <tr>
        <td>First column - not bold</td>
        <td>Second column</td>
      </tr>
    </tbody>
  </table>

关于如何达到预期结果的任何想法？

Answer 1

这样做，您使用直接子选择器var userInputDate; var matchingItems = _.takeWhile(items, {'startDate': userInputDate}); // matchingItems is an array of all items with the same startDate ，>和first-child

:not()

样品

＆＃13;

＆＃13;

table > *:first-child:not(thead) td:first-child {
  font-weight: bold;
}

＆＃13;

table > *:first-child:not(thead) td:first-child {
  font-weight: bold;
}

＆＃13;

＆＃13;

＆＃13;

Answer 2

我已经设法使用以下CSS实现了所需的外观：

  td:first-child {
    font-weight: bold;
  }
  thead + tbody td:first-child {
    font-weight: lighter;
  }