Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Menghapuskan Jarak Sempadan Jadual dalam HTML dan CSS?

Bagaimana untuk Menghapuskan Jarak Sempadan Jadual dalam HTML dan CSS?

DDD
DDDasal
2024-11-15 03:56:02372semak imbas

How to Eliminate Table Border Spacing in HTML and CSS?

Menghapuskan Jarak Sempadan Jadual

Kod yang disediakan mempamerkan jarak yang berlebihan antara baris dan lajur dalam jadual, menghalang penampilan lancar yang diingini. Untuk menyelesaikan isu ini, laksanakan penggayaan berikut:

table {
  border-collapse: collapse;
  border-spacing: 0;
}

Harta sempadan-runtuh: runtuh menggabungkan sempadan jadual bersebelahan, mengalih keluar sebarang pemisahan yang kelihatan antara unsur-unsur. Selain itu, menetapkan jarak sempadan kepada 0 dengan jelas menyatakan penyingkiran jarak sel.

Keserasian Merentas Pelayar

Untuk keserasian merentas penyemak imbas, terutamanya dengan Internet Explorer 6 dan 7, adalah penting untuk menggunakan atribut jarak sel secara langsung pada elemen jadual.

<table cellspacing="0">

Syor Kemas Kini untuk Sokongan Penyemak Imbas

Sambil menetapkan jarak sel secara langsung pernah diperlukan untuk Internet Explorer versi 6 dan 7, versi Internet Explorer yang lebih terkini dan pelayar popular lain menyokong sifat jarak sempadan CSS. Untuk keserasian merentas pelayar, anda dinasihatkan untuk menggunakan kedua-dua kaedah:

table {
  border-collapse: collapse;
  border-spacing: 0;
}

table.no-spacing {
  cellspacing: 0; /* Supports IE6 and IE7 */
}

Atas ialah kandungan terperinci Bagaimana untuk Menghapuskan Jarak Sempadan Jadual dalam HTML dan CSS?. 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