Cita destacada en HTML y CSS (blockquote)

Cita destacada en HTML y CSS (blockquote): para qué sirve

Destaca una frase en medio del texto: el testimonio de un cliente, un fragmento de entrevista o la idea principal del artículo. Escribe la cita, el autor y el cargo, y elige entre cinco estilos: borde lateral, comillas grandes, tarjeta, centrada grande y franja de color, con el color de énfasis y la fuente que prefieras.

El código usa figure, blockquote y figcaption, la forma semántica de marcar una cita con su autor, y acepta la dirección de la fuente en el atributo cite. La vista previa muestra la cita entre dos párrafos, tal como queda en un artículo real.

Cómo usar

1. Escribe la cita y el autor.
2. Elige el estilo, el color y la fuente.
3. Copia el código para tu sitio.

Cuándo usar

• Testimonio destacado en la página de inicio.
• Fragmento de entrevista en el blog.
• Frase destacada en medio del artículo.

Preguntas frecuentes

¿Cuál es la diferencia entre blockquote y q?

blockquote es para una cita en bloque, separada del texto, como las que genera esta herramienta. q es para una cita corta dentro de una frase, y el navegador pone las comillas solo.

¿Cómo indicar al autor de la forma correcta?

Envuelve la cita en un figure y pon al autor en un figcaption justo debajo, como en el código generado. El nombre del autor no va dentro del blockquote, porque no forma parte de lo que se dijo. Si la cita viene de una página, usa el atributo cite con su dirección.

¿Puedo usarlo como testimonio de un cliente?

Sí, para un testimonio destacado. Usa frases reales, con la autorización de la persona. Para varios testimonios juntos, usa el generador de testimonios para sitio web.

¿Es gratis de verdad?

Sí, 100% gratis. Sin registro, sin suscripción y sin límite de uso. Todas las herramientas de Tools123 son gratuitas.

Herramientas similares