Elemento figcaption

Si no sabes lo que es un elemento o cómo debes usarlo, te recomiendo leer el tutorial "Tags y atributos en HTML" que puedes encontrar en la sección de tutoriales HTML.

Descripción

El elemento figcaption representa un título o leyenda de un fragmento de contenido (figure). Un elemento figure representa a un trozo de documento autocontenido que se usa habitualmente para encerrar imágenes, gráficos, tablas de referencia, videos, poemas, fragmentos de código, etc.

La presencia del elemento figcaption dentro de figure es opcional, pero si está presente, sólo puede hacer uno y debe estar ubicado al comienzo o al final del elemento figure al cual pertenece.

Ejemplos

El primer ejempolo muestra a un elemento figure compuesto por una tabla de verdad a la cual se hace referencia en el texto circundante. Esta tabla tiene una leyenda que provee una corta descripción de los contenidos del elemento.

<h1>Tablas de verdad</h1>
<figure style="float: right">
  <table class="default">
    <tr>
      <th class="text-align-center" style="width: 3em">p</th>
      <th class="text-align-center" style="width: 3em">¬p</th>
    </tr>
    <tr>
      <td class="text-align-center">T</th>
      <td class="text-align-center">F</td>
    </tr>
    <tr>
      <td class="text-align-center">F</td>
      <td class="text-align-center">T</td>
    </tr>
  </table>
  <figcaption>Tabla de negación lógica</figcaption>
</figure>
<p>Una tabla de verdad, o tabla de valores de verdad, es una tabla que muestra el valor de verdad de una proposición compuesta, para cada combinación de verdad que se pueda asignar. Fue desarrollada por Charles Sanders Peirce por los años 1880, pero el formato más popular es el que introdujo Ludwig Wittgenstein en su Tractatus logico-philosophicus, publicado en 1921.</p>
<p>La negación es un operador que se ejecuta, sobre un único valor de verdad, devolviendo el valor contradictorio de la proposición considerada.</p>

Tablas de verdad

p ¬p
T F
F T
Tabla de negación lógica

Una tabla de verdad, o tabla de valores de verdad, es una tabla que muestra el valor de verdad de una proposición compuesta, para cada combinación de verdad que se pueda asignar. Fue desarrollada por Charles Sanders Peirce por los años 1880, pero el formato más popular es el que introdujo Ludwig Wittgenstein en su Tractatus logico-philosophicus, publicado en 1921.

La negación es un operador que se ejecuta, sobre un único valor de verdad, devolviendo el valor contradictorio de la proposición considerada.

Una cosa importante a notar en el ejemplo previo: la referencia hecha en el texto al gráfico es realizada mediante su leyenda (figcaption) en lugar de usar referencias espaciales como "el gráfico a la derecha". Esto provee un grado de independencia que permitirá a los autores, reubicar al elemento figure de acuerdo a las necesidades (por ejemplo, para visualización mejorada del contenido en dispositivos con pantallas reducidas).

En nuestro segundo ejemplo, veremos que la presencia de la leyenda no es siempre necesaria en figure. Escribiremos una corta biografía de Charles Dickens acompañada por su retrato en un elemento figure.

<h1>Charles Dickens</h1>
<figure style="float: right">
  <img src="/assets/images/charles-dickens.jpg">
</figure>
<p>Charles John Huffam Dickens fue un destacado escritor y novelista inglés, uno de los más conocidos de la literatura universal, y el más sobresaliente de la era victoriana. Fue maestro del género narrativo, al que imprimió ciertas dosis de humor e ironía, practicando a la vez una aguda crítica social. En su obra destacan las descripciones de gente y lugares, tanto reales como imaginarios.</p>
<p>Nacido en Portsmouth, Dickens abandonó la escuela para trabajar en una fábrica...</p>

Charles Dickens

Charles John Huffam Dickens fue un destacado escritor y novelista inglés, uno de los más conocidos de la literatura universal, y el más sobresaliente de la era victoriana. Fue maestro del género narrativo, al que imprimió ciertas dosis de humor e ironía, practicando a la vez una aguda crítica social. En su obra destacan las descripciones de gente y lugares, tanto reales como imaginarios.

Nacido en Portsmouth, Dickens abandonó la escuela para trabajar en una fábrica...

Por último, veremos que el elemento figcaption puede también utilizarse para agregar información acerca del origen del contenido provisto en figure. Aquí, al mismo ejemplo anterior se le agrega una descripción y una referencia al autor del retrato.

<h1>Charles Dickens</h1>
<figure style="float: right">
  <img src="/assets/images/charles-dickens.jpg">
  <figcaption style="text-align: center">Charles Dickens<br><small>Imagen cortesía de CharlieArt</small></figcaption>
</figure>
<p>Charles John Huffam Dickens fue un destacado escritor y novelista inglés, uno de los más conocidos de la literatura universal, y el más sobresaliente de la era victoriana. Fue maestro del género narrativo, al que imprimió ciertas dosis de humor e ironía, practicando a la vez una aguda crítica social. En su obra destacan las descripciones de gente y lugares, tanto reales como imaginarios.</p>
<p>Nacido en Portsmouth, Dickens abandonó la escuela para trabajar en una fábrica...</p>

Charles Dickens

Charles Dickens
Imagen cortesía de CharlieArt

Charles John Huffam Dickens fue un destacado escritor y novelista inglés, uno de los más conocidos de la literatura universal, y el más sobresaliente de la era victoriana. Fue maestro del género narrativo, al que imprimió ciertas dosis de humor e ironía, practicando a la vez una aguda crítica social. En su obra destacan las descripciones de gente y lugares, tanto reales como imaginarios.

Nacido en Portsmouth, Dickens abandonó la escuela para trabajar en una fábrica...

Atributos

Atributos globales

Para más información acerca de los atributos globales refiérete a esta lista de atributos gloables en HTML5.

Eventos

Eventos globales

Para más información acerca de los eventos globales refiérete a esta lista de eventos globales en HTML5.