<blockquote>El elemento <blockquote> en HTML5 se utiliza para marcar citas textuales largas que provienen de una fuente externa a la que se está refiriendo. Es una forma de facilitar la lectura y la comprensión, diferenciando el texto citado del texto real del documento. Este elemento es importante en el diseño de contenido porque hace que las citas sean fácilmente identificables.
<blockquote><blockquote cite="https://www.example.com/quote-source">
...contenido de la cita...
</blockquote>Además de su atributo específico, <blockquote> admite todos los atributos globales de HTML, que incluyen:
ltr para izquierda a derecha, rtl para derecha a izquierda).<blockquote class="quote" id="uniqueQuote" cite="https://source.com"><blockquote> en HTML5Ahora que hemos revisado los atributos del elemento <blockquote>, pasemos a algunos ejemplos básicos de cómo puede ser utilizado en un documento HTML5.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de Blockquote</title>
</head>
<body>
<p>En el libro "El Principito", de Antoine de Saint-Exupéry, hay una cita memorable:</p>
<blockquote>
"Lo esencial es invisible a los ojos."
</blockquote>
</body>
</html><!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de Blockquote con Fuente</title>
</head>
<body>
<p>A continuación se muestra una cita tomada de "El Principito":</p>
<blockquote cite="https://www.ejemplo.com/el-principito">
"Lo esencial es invisible a los ojos."
</blockquote>
<p>Puedes leer más sobre esta cita en el siguiente <a href="https://www.ejemplo.com/el-principito">enlace</a>.</p>
</body>
</html><!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cita con Estilo</title>
<style>
blockquote.custom-style {
border-left: 5px solid #ccc;
margin: 20px;
padding: 10px;
font-style: italic;
background-color: #f9f9f9;
}
</style>
</head>
<body>
<p>Una cita famosa de una novela clásica:</p>
<blockquote class="custom-style" cite="https://www.ejemplo.com/novela-clasica">
"No todos los que vagan están perdidos."
</blockquote>
</body>
</html>En resumen, el elemento <blockquote> es una poderosa herramienta en HTML5 para la representación de citas textuales largas con la opción de proporcionar una referencia a la fuente de dichas citas mediante el atributo cite. Su uso adecuado mejora la claridad y la estructuración del contenido en los documentos HTML.