The empty-cellsharta di CSS pilihan pelanggan sel jadual kosong bagi maksud menentukan sama ada atau tidak untuk memaparkan sempadan dan latar belakang mereka. Dengan kata lain, ia memberitahu penyemak imbas sama ada melukis sempadan di sekitar sel meja atau mengisi latar belakang apabila sel itu tidak mengandungi isi. Ia seperti menggunakan visibilityharta tanah di sel meja kosong.
table ( empty-cells: show; )Nilai
The empty-cellshartanah mempunyai dua nilai utama:
show: paparkan sempadan dan latar belakang pada sel kosong.hide: tidak memaparkan sempadan atau latar belakang pada sel kosong.
Nilai global berikut juga diterima:
inherit: mewarisi nilai harta benda induk.initial: gunakan nilai lalai yang ditentukan untuk harta tanah.unset: tetapkan semula harta tanah ke nilai yang diwarisi.
Bilakah Menggunakannya
Ini adalah harta benda yang menarik kerana memberikan CSS kemampuan untuk memeriksa markup HTML untuk kandungan di dalam jadual dan memberi respons yang sewajarnya. Kami biasanya tidak menganggap CSS sebagai bahasa yang dinamik tetapi ini adalah contoh di mana ia hampir hampir.
Kes penggunaan yang baik empty-cellsadalah situasi di mana anda mungkin tidak tahu sama ada jadual akan mengandungi atau tidak mengandungi titik data kosong dan anda memutuskan untuk menyembunyikannya. Jadual digunakan untuk susun atur halaman web cara de-facto, jadi ini boleh menjadi alat yang berguna untuk menunjukkan dan menyembunyikan elemen ketika jadual digunakan untuk persembahan atau di mana unsur-unsur mengandungi display: tableharta benda.
Demo
Lihat Pen MPLVzB oleh CSS-Tricks (@ css-tricks) di CodePen.
Berkaitan
displayvisibility:empty
Maklumat lanjut
- Spesifikasi Tahap 2 CSS
- Rujukan MDN
- Demo SitePoint di CodePen
- Lapisan meja dan demo ketelusan di CodePen
Sokongan Penyemak Imbas
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 1.0 | 1.2 | 1.1 | 4.0 | 8.0 | 1.0 | 3.1 |