Ominaisuus empty-cells

Ominaisuus empty-cells määrittää selaimelle, miten näyttää taustan ja reunuksen tyhjille soluille td tai soluille th HTML-taulukossa: näytetäänkö ne vai eivät.

Solu katsotaan tyhjäksi seuraavissa tapauksissa: ei ole lainkaan merkkejä, solu sisältää vain välilyönnin (yksi tai useampi), rivinvaihdon tai sarkainmerkin, tai ominaisuus visibility on asetettu arvoon hidden.

Tehdäkseen solusta ei-tyhjän, mutta samalla ilman näkyvää tekstiä, käytetään seuraavaa keinoa: soluun kirjoitetaan sitova välilyönti  .

Ominaisuus ei toimi, jos border-collapse on asetettu arvoon collapse.

Syntaksi

valitsin {
	empty-cells: show | hide;
}

Arvot

Arvo	Kuvaus
`show`	Tausta ja reunus näytetään tyhjässä solussa.
`hide`	Taustaa ja reunusta ei näytetä tyhjässä solussa.

Oletusarvo: show.

Esimerkki . Arvo show

Nyt taulukossa on joitain tyhjiä soluja, mutta niillä on silti reunus ja tausta:

<table>
	<tr>
		<td>solu</td>
		<td></td>
		<td>solu</td>
	</tr>
	<tr>
		<td></td>
		<td>solu</td>
		<td></td>
	</tr>
	<tr>
		<td>solu</td>
		<td>solu</td>
		<td>solu</td>
	</tr>
</table>

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

Esimerkki . Arvo hide

Mutta nyt tyhjillä soluilla ei ole taustaa ja reunusta:

<table>
	<tr>
		<td>solu</td>
		<td></td>
		<td>solu</td>
	</tr>
	<tr>
		<td></td>
		<td>solu</td>
		<td></td>
	</tr>
	<tr>
		<td>solu</td>
		<td>solu</td>
		<td>solu</td>
	</tr>
</table>

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

Katso myös

pseudoluokka empty,
joka määrittää, miltä tyhjä elementti näyttää