Tag HTML <caption>

Definisi dan penggunaan

<caption> Tag menentukan judul tabel.

Tag caption harus mengikuti tag table. Anda hanya dapat menentukan satu judul untuk setiap tabel.

Petunjuk:Secara default, judul tabel akan diatur di atas tabel dengan penjajaran tengah. Namun, atribut CSS text-align dan caption-side dapat digunakan untuk menata penjajaran dan letak judul.

Lihat pula:

Panduan Referensi HTML DOM:Objek Caption

Contoh

Contoh 1

Tabel dengan judul:

<table>
  <caption>Simpanan Bulanan</caption>
  <tr>
    <th>Bulan</th>
    <th>Tabungan</th>
  </tr>
  <tr>
    <td>Bulan</td>
    <td>￥3000</td>
  </tr>
</table>

Coba Sendiri

Contoh 2

Judul tabel (menggunakan CSS):

<table>
  <caption style="text-align:right">Simpanan Saya</caption>
  <tr>
    <th>Bulan</th>
    <th>Tabungan</th>
  </tr>
  <tr>
    <td>Bulan</td>
    <td>￥3000</td>
  </tr>
</table>
<br>
<table>
  <caption style="caption-side:bottom">Tabungan Saya</caption>
  <tr>
    <th>Bulan</th>
    <th>Tabungan</th>
  </tr>
  <tr>
    <td>Bulan</td>
    <td>￥3000</td>
  </tr>
</table>

Coba Sendiri

Atribut Global

<caption> Tag ini juga mendukung Atribut Global di HTML.

Atribut Event

<caption> Tag ini juga mendukung Atribut Event di HTML.

Pengaturan CSS Standar

Sebagian besar peramban akan menampilkan nilai standar berikut ini <caption> Elemen:

caption {
  display: table-caption;
  text-align: center;
}

Coba Sendiri

Dukungan Peramban

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Dukungan Dukungan Dukungan Dukungan Dukungan