Cómo justificar el texto en una página web en HTML o CSS

Cualquier texto puede alinearse a la izquierda, al centro o a la derecha en una página web. Las imágenes también se pueden alinear en una página web de la misma manera que el texto. A continuación se muestran ejemplos de cómo alinear a la izquierda, tabular, centrar y alinear a la derecha el texto y las imágenes.

Sugerencia: si alguna de las alineaciones de texto no funciona, asegúrese de que otras clases o estilos de CSS aplicados al mismo elemento o elemento que contiene no estén en conflicto con la justificación que intenta realizar.

Nota: Con estos ejemplos y la mayor alineación, el texto se alinea en el elemento que contiene el texto. El texto puede centrarse en un div HTML y alinearse a la izquierda en el resto de la página web. Además, todo lo contenido en la etiqueta que contiene la justificación de CSS (por ejemplo, una imagen) también está alineado.

Ejemplos de alineación

Alineado a la izquierda

Pestaña alineada

Alineado en el centro

Alineado a la derecha

Ejemplo alineado a la izquierda

Por defecto, el inglés y otros idiomas alinean el texto a la izquierda. Sin embargo, si el elemento que contiene el texto o la imagen está alineado a la derecha o si necesita cambiar la alineación del texto o la imagen, el siguiente código se puede agregar a su elemento o en CSS.

Código HTML

Alineado a la izquierda

Consejo: vea los siguientes consejos adicionales para ajustar la alineación, el relleno y el margen de un elemento.

Ejemplo de tabulación alineada

Aunque no hay una alineación de texto de "tabulación", se puede agregar un margen izquierdo a un elemento para la apariencia de una alineación de tabulación, como se muestra a continuación.

Código HTML

Pestaña alineada

Consejo: vea los siguientes consejos adicionales para ajustar la alineación, el relleno y el margen de un elemento.

Ejemplo alineado en el centro

Al usar el atributo de alineación de texto, puede centrar cualquier texto o imagen en un elemento, como se muestra en el siguiente ejemplo.

Código HTML

Alineado en el centro

Consejo: vea los siguientes consejos adicionales para ajustar la alineación, el relleno y el margen de un elemento.

Ejemplo alineado a la derecha

Al usar el atributo de alineación de texto, puede centrar cualquier texto o imagen en un elemento, como se muestra en el siguiente ejemplo.

Código HTML

Alineado a la derecha

Consejo: Alternativamente, puede usar CSS para alinear a la derecha una imagen en una página web.

Consejo: vea los siguientes consejos adicionales para ajustar la alineación, el relleno y el margen de un elemento.

Consejos de alineación adicionales

A continuación se incluyen sugerencias de alineación adicionales que se pueden aplicar a cualquiera de las reglas de estilo anteriores u otras clases de CSS.

  1. Se puede agregar un margen adicional a cualquiera de los estilos anteriores si requiere sangría adicional o si desea más relleno. Por ejemplo, podría aplicar un margen derecho al ejemplo alineado a la derecha para mover el texto hacia el elemento.
  2. Si desea una página más receptiva, asegúrese de ajustar o eliminar cualquier justificación izquierda o derecha cuando se ve en una pantalla más pequeña.