Vlastnosť empty-cells
Vlastnosť empty-cells určuje prehliadaču,
ako zobrazovať pozadie a ohraničenie prázdnych buniek
td alebo buniek
th HTML tabuľky:
zobrazovať alebo nie.
Bunka sa považuje za prázdnu v nasledujúcich prípadoch:
nie sú v nej žiadne znaky, bunka obsahuje
iba medzeru (jednu alebo viac), znak konca
riadka alebo tabulátor, alebo ak je vlastnosť
visibility
nastavená na hidden.
Ak chceme, aby bunka nebola prázdna, ale zároveň
bez viditeľného textu, používa sa nasledujúci
trik: do bunky sa vloží nezlomitelná medzera
.
Vlastnosť nefunguje, ak je nastavená vlastnosť border-collapse
na hodnotu collapse.
Syntax
selektor {
empty-cells: show | hide;
}
Hodnoty
| Hodnota | Popis |
|---|---|
show |
Pozadie a ohraničenie sa zobrazujú pre prázdnu bunku. |
hide |
Pozadie a ohraničenie sa nezobrazujú pre prázdnu bunku. |
Predvolená hodnota: show.
Príklad . Hodnota show
Teraz má tabuľka niektoré bunky prázdne, ale aj tak majú ohraničenie a pozadie:
<table>
<tr>
<td>bunka</td>
<td></td>
<td>bunka</td>
</tr>
<tr>
<td></td>
<td>bunka</td>
<td></td>
</tr>
<tr>
<td>bunka</td>
<td>bunka</td>
<td>bunka</td>
</tr>
</table>
table {
width: 400px;
empty-cells: show;
}
td {
border: 1px solid black;
background-color: #f3f3f3;
text-align: center;
}
:
Príklad . Hodnota hide
A teraz prázdne bunky nebudú mať pozadie a ohraničenie:
<table>
<tr>
<td>bunka</td>
<td></td>
<td>bunka</td>
</tr>
<tr>
<td></td>
<td>bunka</td>
<td></td>
</tr>
<tr>
<td>bunka</td>
<td>bunka</td>
<td>bunka</td>
</tr>
</table>
table {
width: 400px;
empty-cells: hide;
}
td {
border: 1px solid black;
background-color: #f3f3f3;
text-align: center;
}
:
Pozri tiež
-
pseudotrieda
empty,
ktorá určuje vzhľad prázdneho elementu