empty-cellsHotel v CSS izbere praznih celic tabele za navedbo, ali naj se prikaže meje in ozadij na njih. Z drugimi besedami, brskalniku pove, ali naj nariše obrobe okoli celice tabele ali izpolni ozadje, če ta celica ne vsebuje vsebine. To je nekako tako kot uporaba visibilitylastnosti na praznih celicah tabele.
table ( empty-cells: show; )Vrednote
empty-cellsLastnost ima dve osnovni vrednosti:
show: prikaže obrobo in ozadje v prazni celici.hide: ne prikaže obrobe ali ozadja na prazni celici.
Sprejete so tudi naslednje globalne vrednote:
inherit: podeduje vrednost lastnosti nadrejenega elementa.initial: uporabite definirano privzeto vrednost za lastnost.unset: ponastavi lastnost na podedovano vrednost.
Kdaj ga uporabiti
To je zanimiva lastnost, ker CSS-ju omogoča, da v oznaki HTML preveri vsebino tabele in se ustrezno odzove. Običajno CSS ne mislimo kot dinamičnega jezika, vendar je to primer, ko se zelo približa.
Dober primer uporabe empty-cellsbi lahko bila situacija, ko morda ne veste, ali bo tabela vsebovala prazne podatkovne točke ali ne, in se jih odločite skriti. Včasih so bile tabele dejansko način oblikovanja postavitev spletnih strani, zato je lahko koristno orodje za prikaz in skrivanje elementov, kadar se tabele uporabljajo za predstavitev ali kjer elementi vsebujejo display: tablelastnost.
Demo
Oglejte si Pen mPLVzB by CSS-Tricks (@ css-tricks) na CodePen.
Sorodno
displayvisibility:empty
Več informacij
- CSS Level 2 spec
- Referenca MDN
- Predstavitev SitePoint na CodePenu
- Sloji tabel in predstavitev preglednosti na CodePenu
Podpora za brskalnik
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 1.0 | 1.2 | 1.1 | 4.0 | 8,0 | 1.0 | 3.1 |