Etiqueta <figcaption> de HTML

Definición y uso

<figcaption> Etiqueta para <figure> El elemento define el título.

<figcaption> El elemento puede colocarse en <figure> Posición del primer o último elemento hijo del elemento.

Véase también:

Manual de referencia HTML DOM:Objeto Figcaption

Ejemplo

Ejemplo 1

Usar el elemento <figure> para marcar fotos en el documento, usar el elemento <figcaption> para definir el título de la foto:

<figure>
  <img src="tulip.jpg" alt="Tulipa" style="width:300px">
  <figcaption>Figura 1 - Tulipa, Liliaceae, planta herbácea perenne.</figcaption>
</figure>

Prueba personalmente

Ejemplo 2

Configurar estilos de CSS para <figure> y <figcaption>:

<html>
<head>
<style>
figura {
  borde: 1px #cccccc sólido;
  rejilla: 4px;
  margen: auto;
}
figcaption {
  fondo: negro;
  color: blanco;
  estilo: cursiva;
  rejilla: 2px;
  alineación: centro;
}
</style>
</head>
</body>
<figure>
  <img src="tulip.jpg" alt="Tulipa" style="width:300px">
  <figcaption>Figura 1 - Tulipa, Liliaceae, planta herbácea perenne.</figcaption>
</figure>
</body>
</html>

Prueba personalmente

Atributos globales

<figcaption> La etiqueta también admite Atributos globales en HTML.

Atributos de eventos

<figcaption> La etiqueta también admite Atributos de eventos en HTML.

Configuración CSS predeterminada

La mayoría de los navegadores mostrarán los valores siguientes por defecto <figcaption> Elemento:

figcaption {
  display: block;
}

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que primero admitió este elemento.

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