Vlastnost empty-cells

Vlastnost empty-cells určuje prohlížeči, jak zobrazovat pozadí a ohraničení prázdných buněk td nebo buněk th HTML tabulky: zobrazovat nebo ne.

Buňka je považována za prázdnou v následujících případech: nejsou vůbec žádné znaky, v buňce je obsažen pouze mezera (jedna nebo více), zalomení řádku nebo znak tabulátoru, nebo je vlastnost visibility nastavena jako hidden.

Pro vytvoření buňky, která není prázdná, ale zároveň bez viditelného textu, se používá následující trik: do buňky se zapíše nezlomitelná mezera  .

Vlastnost nefunguje, pokud je nastaveno border-collapse na hodnotu collapse.

Syntaxe

selektor {
	empty-cells: show | hide;
}

Hodnoty

Hodnota	Popis
`show`	Pozadí a ohraničení se zobrazují u prázdné buňky.
`hide`	Pozadí a ohraničení se nezobrazují u prázdné buňky.

Výchozí hodnota: show.

Příklad . Hodnota show

Nyní jsou v tabulce některé buňky prázdné, ale přesto mají ohraničení a pozadí:

<table>
	<tr>
		<td>buňka</td>
		<td></td>
		<td>buňka</td>
	</tr>
	<tr>
		<td></td>
		<td>buňka</td>
		<td></td>
	</tr>
	<tr>
		<td>buňka</td>
		<td>buňka</td>
		<td>buňka</td>
	</tr>
</table>

table {
	width: 400px;
	empty-cells: show;
}
td {
	border: 1px solid black;
	background-color: #f3f3f3;
	text-align: center;
}

Příklad . Hodnota hide

A nyní prázdné buňky nebudou mít pozadí a ohraničení:

<table>
	<tr>
		<td>buňka</td>
		<td></td>
		<td>buňka</td>
	</tr>
	<tr>
		<td></td>
		<td>buňka</td>
		<td></td>
	</tr>
	<tr>
		<td>buňka</td>
		<td>buňka</td>
		<td>buňka</td>
	</tr>
</table>

table {
	width: 400px;
	empty-cells: hide;
}
td {
	border: 1px solid black;
	background-color: #f3f3f3;
	text-align: center;
}

Viz také

pseudotřída empty,
která určuje, jak bude vypadat prázdný element