Az empty-cells tulajdonság

A empty-cells tulajdonság megadja a böngészőnek, hogyan jelenítse meg a HTML táblázat üres td celláinak vagy th celláinak a hátterét és szegélyét: mutassa vagy ne.

Egy cella akkor tekinthető üresnek a következő esetekben: egyetlen karakter sincs benne, a cella csak szóközt (egy vagy több), sortörést vagy tabulátor karaktert tartalmaz, vagy a visibility tulajdonság hidden értékre van állítva.

Ahhoz, hogy egy cella ne legyen üres, de látható szöveg nélkül, a következő trükköt alkalmazzák: a cellába egy nem törhető szóközt   írnak.

A tulajdonság nem működik, ha a border-collapse collapse értékre van állítva.

Szintaxis

szelektor {
	empty-cells: show | hide;
}

Értékek

Érték	Leírás
`show`	Az üres cella háttere és szegélye megjelenik.
`hide`	Az üres cella háttere és szegélye nem jelenik meg.

Alapértelmezett érték: show.

Példa . Show érték

Jelenleg a táblázatban néhány cella üres, de mindegyiknek van szegélye és háttere:

<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;
}

Példa . Hide érték

Most viszont az üres celláknak nem lesz háttérszíne és szegélye:

<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;
}

Lásd még

a empty pszeudoosztály,
amely meghatározza, hogyan fog kinézni egy üres elem