Propriedade text-align
Última atualização: 2026-09-13
text-align Propriedade text-align
A propriedade text-align do CSS define o alinhamento horizontal do texto dentro de um elemento de nível de bloco. Ela suporta os valores left, right, center e justify e se aplica a parágrafos, títulos, células de tabela e qualquer outro contêiner de bloco. Observe que o text-align alinha o conteúdo dentro do elemento, não o próprio elemento.
| Categoria | |
|---|---|
| Valor Inicial | start |
| Herdado | Sim |
| Aplica-se A | block |
| Tipo de Animação | discrete |
| Versão CSS | CSS1 |
| Status | Padrão |
📝 Sintaxe
text-align: start | end | left | right | center | justify | match-parent;⚙️ Valores
| Valor | Tipo | Descrição |
|---|---|---|
start | end | left | right | center | justify | match-parent | Palavra-chave | Valores de alinhamento horizontal do texto |
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo no playground:
🌐 Suporte dos Navegadores
| Navegador |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| text-align | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os principais navegadores | |||||
Dica： start e end são resolvidos para a borda esquerda ou direita com base na direção do texto, sendo uma opção melhor que left/right para sites multilíngues.
Aviso： text-align afeta apenas elementos de nível de bloco; para centralizar horizontalmente um elemento inline como uma imagem, defina text-align: center no pai.
❓ Perguntas Frequentes
QPor que text-align: justify às vezes parece não ter efeito?
AA justificação só se aplica a linhas que não sejam a última de um parágrafo de várias linhas. Se o texto for uma única linha, ou se a linha for a última do parágrafo, justify não produz ajuste de espaçamento visível.
QA propriedade text-align pode ser usada para centralizar texto verticalmente no CSS?
ANão. O text-align controla apenas o alinhamento horizontal. Para centralização vertical, use line-height, vertical-align, Flexbox ou Grid.
QComo centralizo uma imagem horizontalmente dentro de um contêiner usando CSS?
AUma imagem é um elemento inline, então margin: auto nela não tem efeito. Defina text-align: center no contêiner pai; ou torne a imagem display: block e use margin: 0 auto. Em Flexbox, use justify-content: center.
🏷️ Propriedades Relacionadas
💡 Casos relacionados
📚 Tutoriais Relacionados
Propriedade text-align-last
Controla o alinhamento da última linha de um parágrafo.
Propriedade vertical-align
Controla o alinhamento vertical de elementos inline.
