Savybė caption-side

Savybė caption-side nustato lentelės antraštės, sukurtos naudojant žymą <caption>, padėtį. Ši savybė gali turėti dvi reikšmes: top (lentelės viršuje, pagal nutylėjimą) arba bottom (po lentele).

Sintaksė

selektorius {
	caption-side: top | bottom;
}

Pavyzdys

Pastatykime antraštę virš lentelės:

<table border="1" width="300">
	<caption>Lentelė</caption>
	<tr>
		<th>Antraštė</th>
		<th>Aprašymas</th>
	</tr>
	<tr>
		<td>tekstas1</td>
		<td>tekstas2</td>
	</tr>
</table>

table {
	width: 100%;
	border-collapse: collapse;
}
td {
	width: 200px;
	height: 100px;
	text-align: center;
}
caption {
	caption-side: top;
	font-weight: bold;
}

Pavyzdys

O dabar perkelkime antraštę po lentele:

<table border="1" width="300">
	<caption>Lentelė</caption>
	<tr>
		<th>Antraštė</th>
		<th>Aprašymas</th>
	</tr>
	<tr>
		<td>tekstas1</td>
		<td>tekstas2</td>
	</tr>
</table>

table {
	width: 100%;
	border-collapse: collapse;
}
td {
	width: 200px;
	height: 100px;
	text-align: center;
}
caption {
	caption-side: bottom;
	font-weight: bold;
}

Taip pat žiūrėkite

savybė bottom,
kuri nustato elemento apatinio krašto poziciją
savybė top,
kuri nustato elemento viršutinio krašto poziciją
savybė left,
kuri nustato elemento kairiojo krašto poziciją
savybė right,
kuri nustato elemento dešiniojo krašto poziciją
pseudoelementas ::backdrop,
kuris nustato išdėstymą po pirmojo elemento