Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Menambah Sempadan Bawah pada Setiap Baris dalam Jadual HTML?

Bagaimanakah Saya Boleh Menambah Sempadan Bawah pada Setiap Baris dalam Jadual HTML?

DDD
DDDasal
2024-12-14 00:29:11950semak imbas

How Can I Add a Bottom Border to Each Row in an HTML Table?

Tambah Sempadan ke Bawah Baris Jadual

Anda menghadapi masalah apabila cuba menambah jidar hitam pepejal pada bahagian bawah setiap baris jadual (). Menggunakan gaya sebaris atau CSS pada mulanya terbukti tidak berkesan.

Untuk membetulkan perkara ini, masukkan keruntuhan sempadan: runtuh; dalam peraturan jadual dalam CSS anda:

table {
    border-collapse: collapse;
}

Pengubahsuaian ini pada asasnya menggabungkan sempadan bersebelahan, memastikan bahawa sempadan yang digunakan pada baris individu kelihatan.

Contoh Kod:

<table>
  <tr><td>A1</td><td>B1</td><td>C1</td></tr>
  <tr><td>A2</td><td>B2</td><td>C2</td></tr>
  <tr><td>A2</td><td>B2</td><td>C2</td></tr>
</table>
table {
  border-collapse: collapse;
}

tr {
  border-bottom: 1pt solid black;
}

Setelah menggunakan CSS ini, sempadan antara baris dalam jadual menjadi kelihatan seperti yang dijangkakan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menambah Sempadan Bawah pada Setiap Baris dalam Jadual HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn