Estos elementos se emplean para incluir en tus páginas trozos de contenidos de otras fuentes.
3.7.1. Blockquote por defecto
Utiliza el elemento <blockquote>
para encerrar el contenido que se va a incluir en la página. También se recomienda utilizar el elemento <p>
para encerrar el texto dentro del <blockquote>
. Ejemplo:
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
</blockquote>
Así se ve este ejemplo en tu navegador:
Y esta es la imagen del aspecto que debería tener este ejemplo:
3.7.2. Opciones para los elementos blockquote
Además del estilo por defecto del elemento <blockquote>
, Bootstrap 3 define algunos estilos adicionales para los otros elementos que se pueden añadir a los elementos <blockquote>
.
3.7.2.1. Mostrando la fuente
Utiliza el elemento <small>
para mostrar la fuente original del contenido y encierra el nombre concreto de la fuente (una persona, una publicación, un sitio web, etc.) con el elemento <cite>
. Ejemplo:
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<small>Frase célebre de <cite title="Nombre Apellidos">Nombre Apellidos</cite></small>
</blockquote>
Así se ve este ejemplo en tu navegador:
Y esta es la imagen del aspecto que debería tener este ejemplo:
3.7.2.2. Modificando la alineación
Algunos autores prefieren modificar la alineación de las citas creadas con <blockquote>
para que destaquen más sobre el resto del texto. Para ello, utiliza la calse .pull-right
. Ejemplo:
<blockquote class="pull-right">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<small>Frase célebre de <cite title="Nombre Apellidos">Nombre Apellidos</cite></small>
</blockquote>
Así se ve este ejemplo en tu navegador:
Y esta es la imagen del aspecto que debería tener este ejemplo: