css 偶数の行だけ色をつける

css

css 偶数の行だけ色をつける

CSS3で実装されたnth-childという疑似クラスがあり、たとえば表（テーブル）の、偶数行だけ色をつける、などということが簡単にできます。

 <!-- HTML -->
 <table class="zebra">
  <tr>
    <td>
      ボロネーゼ
    </td>
   </tr>
   <tr>
     <td>
       カルボナーラ
     </td>
    </tr>
  </table>

 /* css */
 table.zebra tr:nth-child(2n) td {
     background-color: #E9F4FC;
 }