Figuras

Documentación y ejemplos para mostrar imágenes y texto relacionados con el componente de figura en Bootstrap.

Siempre que necesite mostrar un fragmento de contenido, como una imagen con un título opcional, considere usar un archivo <figure> .

Utilizar los incluidos .figure , .figure-img y .figure-caption clases para proporcionar algunos de los estilos de línea de base para el HTML5 <figure> y <figcaption> elementos. Las imágenes en las figuras no tienen un tamaño explícito, así que asegúrese de agregar la .img-fluid clase a su <img> para que responda.

Placeholder 400x300
Una leyenda para la imagen de arriba.
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

Alinear el título de la figura es fácil con nuestras utilidades de texto .

Placeholder 400x300
Una leyenda para la imagen de arriba.
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption text-right">A caption for the above image.</figcaption>
</figure>