Bagaimana untuk Memaparkan Sempadan Sel Kosong dalam CSS?

CSS untuk Memaparkan Sempadan Sel Kosong

Dalam susun atur jadual, sel kosong boleh menyembunyikan sempadannya, menjadikannya mencabar untuk mencapai konsistensi visual penampilan. Terutamanya dalam Internet Explorer 7, sel kosong mungkin tidak dipaparkan dengan sempadan yang boleh dilihat. Untuk menangani isu ini, pertimbangkan penyelesaian CSS berikut:

Menggunakan Ruang Tanpa Pecah ( )

Salah satu kaedah ialah memasukkan ruang tidak pecah ( ) ke dalam sel itu. Watak ini akan menempati ruang, membenarkan jidar dipaparkan:

td:empty {
  content: ' ';
}

Menyembunyikan Sel Kosong

Dalam IE8, sel kosong dipaparkan secara lalai. Untuk menyembunyikannya dan mendedahkan sempadannya, anda boleh menggunakan CSS berikut:

td:empty {
  empty-cells: hide;
}

Walau bagaimanapun, pendekatan ini tidak berfungsi dalam IE7. Dalam penyemak imbas ini, sel kosong disembunyikan secara lalai, menjadikannya sukar untuk menunjukkan sempadannya menggunakan CSS sahaja.

Pertimbangan Lain

Jika anda memerlukan penyelesaian CSS semata-mata, anda mungkin perlu mempertimbangkan penyelesaian khusus penyemak imbas atau kaedah alternatif, seperti menggunakan JavaScript atau pengiraan jadual untuk mengendalikan sel kosong.

Atas ialah kandungan terperinci Bagaimana untuk Memaparkan Sempadan Sel Kosong dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!