Bagaimana untuk Menambah Ruang Antara Baris Jadual dengan CSS?

Cara Mencipta Ruang Antara Baris Jadual

Memisahkan baris meja boleh dicapai menggunakan sifat padding pada elemen td. Untuk memberikan jarak yang diingini, gunakan CSS berikut:

/* Apply padding to td elements that are direct children of tr elements with class spaceUnder. */
tr.spaceUnder > td {
  padding-bottom: 1em;
}

Kod ini memastikan bahawa padding hanya digunakan pada elemen td yang diturunkan terus daripada elemen tr dengan class spaceUnder. Ini membenarkan jadual bersarang.

Untuk menunjukkan, pertimbangkan jadual berikut:

<table>
  <tbody>
    <tr>
      <td>A</td>
      <td>B</td>
    </tr>
    <tr class="spaceUnder">
      <td>C</td>
      <td>D</td>
    </tr>
    <tr>
      <td>E</td>
      <td>F</td>
    </tr>
  </tbody>
</table>

Dengan CSS yang disediakan, akan ada ruang di bawah CD baris, manakala baris AB dan EF kekal tidak terjejas .

Atas ialah kandungan terperinci Bagaimana untuk Menambah Ruang Antara Baris Jadual dengan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!