Својството empty-cells

Својството empty-cells му укажува на прелистувачот како да ги прикажува позадината и границата на празните ќелии td или ќелии th на HTML табелата: дали да ги прикажува или не.

Ќелијата се смета за празна во следниве случаи: нема никакви знаци, во ќелијата содржи само празно место (едно или повеќе), превод на ред или табулатор, или својството visibility е поставено како hidden.

За да се направи ќелијата не празна, но во исто време без видлив текст, се користи следниов прием: во ќелијата се запишува нераздвојно празно место  .

Својството не функционира, ако е зададено border-collapse во вредност collapse.

Синтакса

селектор {
	empty-cells: show | hide;
}

Вредности

Вредност	Опис
`show`	Позадината и границата се прикажуваат кај празната ќелија.
`hide`	Позадината и границата не се прикажуваат кај празната ќелија.

Стандардна вредност: show.

Пример . Вредност show

Моментално во табелата некои ќелии се празни, но тие сепак имаат граница и позадина:

<table>
	<tr>
		<td>cell</td>
		<td></td>
		<td>cell</td>
	</tr>
	<tr>
		<td></td>
		<td>cell</td>
		<td></td>
	</tr>
	<tr>
		<td>cell</td>
		<td>cell</td>
		<td>cell</td>
	</tr>
</table>

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

Пример . Вредност hide

А сега празните ќелии нема да имаат позадина и граница:

<table>
	<tr>
		<td>cell</td>
		<td></td>
		<td>cell</td>
	</tr>
	<tr>
		<td></td>
		<td>cell</td>
		<td></td>
	</tr>
	<tr>
		<td>cell</td>
		<td>cell</td>
		<td>cell</td>
	</tr>
</table>

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

Погледнете ги исто така

псевдо-класата empty,
која го одредува тоа како ќе изгледа празниот елемент