Tanda <figcaption> HTML

Definisi dan penggunaan

<figcaption> Tandai dengan <figure> Elemen menentukan judul.

<figcaption> Elemen dapat ditempatkan di <figure> Lokasi elemen pertama atau terakhir anak.

Lihat pula:

Panduan HTML DOM:Objek Figcaption

Contoh

Contoh 1

Gunakan elemen <figure> untuk menandai foto di dokumen, gunakan elemen <figcaption> untuk menentukan judul foto:

<figure>
  <img src="tulip.jpg" alt="Tulip" style="width:300px">
  <figcaption>Gambar 1 - Tulip, anggota famili Liliaceae, tumbuhan bunga berbunga tahunan.</figcaption>
</figure>

Coba Sendiri

Contoh 2

Gunakan CSS untuk menata gaya <figure> dan <figcaption>:

<html>
<head>
<style>
figure {
  border: 1px #cccccc solid;
  padding: 4px;
  margin: otomatis;
}
figcaption {
  background-color: hitam;
  warna: putih;
  font-style: miring;
  padding: 2px;
  text-align: tengah;
}
</style>
</head>
</body>
<figure>
  <img src="tulip.jpg" alt="Tulip" style="width:300px">
  <figcaption>Gambar 1 - Tulip, anggota famili Liliaceae, tumbuhan bunga berbunga tahunan.</figcaption>
</figure>
</body>
</html>

Coba Sendiri

Atribut Global

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

Atribut Event

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

Pengaturan CSS Default

Sebagian besar browser akan menampilkan nilai default berikut ini <figcaption> Elemen:

figcaption {
  display: block;
}

Dukungan Browser

Angka di tabel menunjukkan versi browser pertama yang mendukung elemen ini.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
8.0 9.0 4.0 5.1 11.0