El elemento blockquote de html. Atributo cite y la etiqueta cite.
La definición mas extendida del elemento blockquote es, que se utiliza para centrar texto, sin embargo no es del todo cierta esta afirmación. Cierto es que el navegador presenta los párrafos aplicando una sangría por defecto, pero la principal utilidad del blockquote es para hacer referencia a fuentes o presentar partes de texto que estamos ilustrando en nuestra página web en forma de cita. El atributo cite (que no hay que confundir con la etiqueta <cite>) suele acompañar al elemento blockquote para hacer mención o citar a dicha fuente en forma de url. veamos su síntexis con un ejemplo:
<p>Definición que hace wikipedia de página web:</p>
<blockquote cite=»https://es.wikipedia.org/wiki/Pagina_web»>
<p>Una página web es el nombre de un documento o información electrónica adaptada para la World Wide Web y que puede ser accedida mediante un navegador para mostrarse en un monitor de computadora o dispositivo móvil. Esta información se encuentra generalmente en formato HTML o XHTML, y puede proporcionar navegación a otras páginas web mediante enlaces de hipertexto. Las páginas web frecuentemente incluyen otros recursos como hojas de estilo en cascada, guiones (scripts) e imágenes digitales, entre otros.</p>
</blockquote>
<p>Este es un ejemplo del uso de blockquote</p>
El navegador mostraría lo anterior así:
Definición que hace wikipedia de página web:
Una página web es el nombre de un documento o información electrónica adaptada para la World Wide Web y que puede ser accedida mediante un navegador para mostrarse en un monitor de computadora o dispositivo móvil. Esta información se encuentra generalmente en formato HTML o XHTML, y puede proporcionar navegación a otras páginas web mediante enlaces de hipertexto. Las páginas web frecuentemente incluyen otros recursos como hojas de estilo en cascada, guiones (scripts) e imágenes digitales, entre otros.
Este es un ejemplo del uso de blockquote
Como podeis ver el elemento blockquote ha aplicado una sangría al párrafo que etiqueta o contiene.
La url citada o fuente de la que hemos sacado nuestro contenido, no se presenta en el navegador, pero ya se ha dejado constancia de ella en nuestro código.
Hay que señalar, que el elemento blockquote solo funciona si alberga otro elemento de bloque o blocklevel, como puede ser un elemento de encabezado o mejor aún un párrafo.
Para hacer referencia a una fuente o citar un autor, etc y que el resultado se pueda ver en pantalla, tenemos la etiqueta <cite>, que se introduce en la misma linea donde está el contenido a citar, por ejemplo:
tenemos unas frases del célebre cómico Groucho Marx así escritas:
Estos son mis principios y si no les gustan, tengo mas.
Fuera del perro, un libro es probablemente el mejor amigo del hombre, y dentro del perro probablemente está demasiado oscuro para leer. Groucho marx.
Nota: Groucho marx , que gran hombre, fue un
genio.
Si aplicamos el elemento cite al nombre:
«Groucho marx», dentro de un elemento blockquote de esta manera:
<blockquote>
<p>Estos son mis principios y si no les gustan, tengo más.</p>
<p> Fuera del perro, un libro es probablemente el mejor amigo del hombre, y dentro del perro probablemente está demasiado oscuro para leer.
</p>
<p><cite>Groucho marx.</cite></p>
</blockquote>
El navegador lo mostraria así:
Estos son mis principios y si no les gustan, tengo más.
Fuera del perro, un libro es probablemente el mejor amigo del hombre, y dentro del perro probablemente está demasiado oscuro para leer.
Groucho marx.
Como podeis ver el navegador muestra el contenido del elemento cite en cursiva por defecto. Con css podemos darle el toque personal que más no guste, pero no adelantemos acontecimientos, todo llegará a su debido tiempo. Aprender html de forma correcta, os evitará muchas horas perdidas después, tratando de solucionar problemas. mejor proseguimos con el curso.
el elemento cite, puede actuar en párrafos, sin necesidad de estar etiquetados dentro de un blockquote. Podemos añadir el atributo title, o citar a otra página o url, etc.
Como ya dijimos, dentro de un elemento block-level pueden coexistir varios elementos inline-level, pero no al revés, porque dentro de un elemento inline-level, solo puede haber atributos u otros elementos inline-level, aparte del contenido.