Hay varias maneras de agregar sangrías en HTML antes de un texto. Pero para asegurar compatibilidad con diferentes navegadores y accesibilidad, revisaremos los métodos más populares:
Método recomendado en CSS y HTML
Para sangrar texto o párrafos, lo mejor es usar CSS. Aquí hay ejemplos de cómo sangrar texto usando hojas de estilo en cascada. Inserta cada uno de los ejemplos de código entre las etiquetas HTML <head></head>.
Este código crea una clase CSS “tab” que sangra el texto y el párrafo 40 píxeles desde el margen izquierdo:
Consejo adicional: Para cambiar la sangría izquierda a derecha, cambia la propiedad margin-left por margin-right.
Método recomendado en HTML
Puedes lograr los mismos resultados usando estilos integrados en el código HTML. Aunque usar CSS facilita la administración de varias páginas web, si solo vas a usar el estilo una vez:
<p style="margin-left: 40px">Este texto tiene sangría.</p>Aquí, todo el texto del párrafo se sangra 40 píxeles hacia la izquierda. Otros párrafos <p> no se verán afectados.
<p style="text-indent: 40px">Este texto tiene sangría.</p>Y aquí, solo la primera línea del párrafo se sangra 40 píxeles hacia la izquierda. Ninguna línea adicional se verá afectada.
Consejo: Puedes establecer la sangría usando porcentajes. Por ejemplo, en lugar de sangrar 40 píxeles, puedes reemplazar el valor por 5% para sangrar el texto en un 5%.
Consejo adicional: Puedes cambiar la sangría izquierda a derecha cambiando la propiedad margin-left por margin-right.
Método alternativo
Otro método común para crear sangrías de texto en HTML es usar <blockquote>, como se muestra a continuación.
Aunque es mucho más fácil, hay problemas de compatibilidad que pueden surgir al usar esta solución. Esta etiqueta está destinada a citas, no a sangrías:
<blockquote>Esta línea tendrá sangría.</blockquote>
