javascript - 如何使用子选择器将 css 应用于父级 - 使用 css 或 angular 2

Question

如何使用子选择器（ mat-checkbox-checked ）应用 css 属性，需要将属性应用到其父 td 和兄弟姐妹...无需申请第二个 tr 及其子代。仅使用 css 或 angular 2 或 material 或 javascript ..！不使用 jQuery

<table>
      <tbody>
        <!-- apply styles to this row -->
        <tr>
          <td>
            <mat-checkbox class="mat-checkbox-checked"></mat-checkbox>
          </td>
          <td>data 1</td>
          <td>data 2</td>
          <td>data 3</td>
          <td>data 4</td>
        </tr>
      <!-- No need to apply styles to this row -->
        <tr>
          <td>
            <mat-checkbox class="mat-checkbox"></mat-checkbox>
          </td>
          <td>data 1</td>
          <td>data 2</td>
          <td>data 3</td>
          <td>data 4</td>
        </tr>
      </tbody>
    </table>

标签： javascriptcssangularmaterial-designangular-material

Answer 1

如果要选择此表的第一行，可以执行以下操作：

tbody tr:first-child  {
    background: red;
}

希望这会有所帮助。