「CSS入門」nth-child(2n)でテーブルの偶数行を設定する

2020年7月2日

構文
:nth-child(2n)
:nth-child(even)

CSSコード

table{border-collapse:collapse}
td{border:2px solid #000000}

tr:nth-child(2n)  {
    background-color: red;
}

htmlコード

<table>
      <tr><td>data-111</td></tr>
      <tr><td>data-222</td></tr>
      <tr><td>data-333</td></tr>
      <tr><td>data-4444</td></tr>
      <tr><td>data-5555</td></tr>
</table>