empty-cellsVara CSS valib tühi tabelilahtrite eesmärgil täpsustatakse, kas näidata piiride ja taustaga neile. Teisisõnu ütleb see brauserile, kas tõmmata tabeliraku ümber piirid või täita taust, kui see lahter ei sisalda sisu. See on umbes nagu visibilityomaduse rakendamine tühjadele tabelirakkudele.
table ( empty-cells: show; )Väärtused
empty-cellsVara on kaks peamist väärtust:
show: kuvada ääris ja taust tühjal lahtril.hide: ei kuva tühja lahtri äärist ega tausta.
Aktsepteeritakse ka järgmisi globaalseid väärtusi:
inherit: päri vanemelemendi atribuudi väärtus.initial: kasutage atribuudi jaoks määratletud vaikeväärtust.unset: lähtestage vara pärandväärtusele.
Millal seda kasutada
See on huvitav omadus, kuna see annab CSS-ile võimaluse kontrollida tabeli sees oleva HTML-i märgistust ja vastavalt sellele reageerida. Me ei mõtle tavaliselt CSS-ist kui dünaamilisest keelest, kuid see on näide, kus see on üsna lähedal.
Hea kasutusvõimalus empty-cellsvõib olla olukord, kus te ei pruugi teada, kas tabelis on tühjad andmepunktid või mitte, ja otsustate need peita. Tabelid olid veebilehtede paigutuse de facto koostamise viisid, nii et see võiks olla kasulik tööriist elementide kuvamiseks ja peitmiseks, kui esitamiseks kasutatakse tabeleid või kui elemendid sisaldavad display: tableomadust.
Demo
Vaadake CodePenil CSS-Tricks (@ css-tricks) pliiatsit mPLVzB.
Seotud
displayvisibility:empty
Rohkem informatsiooni
- CSS 2. taseme spetsifikatsioon
- MDN viide
- SitePointi demo CodePenis
- Tabelikihid ja läbipaistvuse demo CodePenis
Brauseri tugi
| Chrome | Safari | Firefox | Ooper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 1.0 | 1.2 | 1.1 | 4.0 | 8,0 | 1.0 | 3.1 |