Qualquer texto pode ser alinhado à esquerda, ao centro ou à direita em uma página da web. As imagens também podem ser alinhadas em uma página da web da mesma maneira que o texto. Abaixo, há exemplos de como alinhar texto e imagens à esquerda, à guia, ao centro e à direita.

Dica: se algum alinhamento de texto não estiver funcionando, verifique se outras classes CSS ou estilos aplicados ao mesmo elemento ou a um elemento contido não estão em conflito com a justificação que você está tentando fazer.

Nota: Com estes exemplos e a maior parte do alinhamento, o texto é alinhado no elemento que contém o texto. O texto pode ser centralizado em um div de HTML e ser alinhado à esquerda no restante da página da web. Além disso, qualquer coisa contida na tag que contém a justificativa do CSS (por exemplo, uma imagem) também está alinhada.

Exemplos de alinhamento

Esquerda alinhada

Tabulação alinhada

Alinhado ao centro

Alinhados à direita

Exemplo alinhado à esquerda

Por padrão, o inglês e outros idiomas alinham o texto à esquerda. No entanto, se o elemento que contém o texto ou a imagem estiver alinhado à direita ou você precisar alterar o alinhamento do texto ou da imagem, o código abaixo poderá ser adicionado ao elemento ou ao CSS.

Código HTML

Esquerda alinhada

Dica: veja as dicas adicionais abaixo para ajustar o alinhamento, preenchimento e margem de um elemento.

Exemplo alinhado por tabulações

Embora não haja um alinhamento de texto de "tabulação", uma margem esquerda pode ser adicionada a um elemento para a aparência de um alinhamento de tabulação, conforme mostrado abaixo.

Código HTML

Tabulação alinhada

Dica: veja as dicas adicionais abaixo para ajustar o alinhamento, preenchimento e margem de um elemento.

Exemplo alinhado ao centro

Usando o atributo de alinhamento de texto, você pode centralizar qualquer texto ou imagem em um elemento, conforme mostrado no exemplo abaixo.

Código HTML

Alinhado ao centro

Dica: veja as dicas adicionais abaixo para ajustar o alinhamento, preenchimento e margem de um elemento.

Exemplo alinhado à direita

Usando o atributo de alinhamento de texto, você pode centralizar qualquer texto ou imagem em um elemento, conforme mostrado no exemplo abaixo.

Código HTML

Alinhados à direita

Dica: Como alternativa, você pode usar CSS para alinhar à direita uma imagem em uma página da web.

Dica: veja as dicas adicionais abaixo para ajustar o alinhamento, preenchimento e margem de um elemento.

Dicas adicionais de alinhamento

Abaixo estão dicas adicionais de alinhamento que podem ser aplicadas a qualquer uma das regras de estilo acima ou outras classes CSS.

1. Uma margem adicional pode ser adicionada a qualquer um dos estilos acima, se você precisar de recuo adicional ou quiser mais preenchimento. Por exemplo, você poderia aplicar um direito de margem ao exemplo alinhado à direita para mover o texto ainda mais para o elemento.
2. Se você deseja uma página mais responsiva, ajuste ou remova qualquer justificativa para a esquerda ou para a direita quando visualizada em uma tela menor.