Sifat caption-side

Sifat caption-side menetapkan kedudukan kapsyen jadual, yang dibuat menggunakan tag <caption>. Sifat ini mempunyai dua nilai yang mungkin: top (di atas jadual, secara lalai) atau bottom (di bawah jadual).

Sintaks

selector {
	caption-side: top | bottom;
}

Contoh

Mari letakkan kapsyen di atas jadual:

<table border="1" width="300">
	<caption>Jadual</caption>
	<tr>
		<th>Kepala</th>
		<th>Keterangan</th>
	</tr>
	<tr>
		<td>teks1</td>
		<td>teks2</td>
	</tr>
</table>

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

Contoh

Sekarang mari alihkan kapsyen ke bawah jadual:

<table border="1" width="300">
	<caption>Jadual</caption>
	<tr>
		<th>Kepala</th>
		<th>Keterangan</th>
	</tr>
	<tr>
		<td>teks1</td>
		<td>teks2</td>
	</tr>
</table>

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

Lihat juga

sifat bottom,
yang menetapkan kedudukan tepi bawah elemen
sifat top,
yang menetapkan kedudukan tepi atas elemen
sifat left,
yang menetapkan kedudukan tepi kiri elemen
sifat right,
yang menetapkan kedudukan tepi kanan elemen
unsur pseudo ::backdrop,
yang menetapkan kedudukan selepas elemen pertama