Alinhamento do Texto do CSS

Alinhamento de texto

text-align A propriedade é usada para configurar o alinhamento horizontal do texto.

O texto pode estar alinhado à esquerda, à direita ou centralizado.

O exemplo a seguir mostra o alinhamento centralizado e o alinhamento à esquerda e à direita do texto (se a direção do texto for de esquerda para direita, o alinhamento padrão é à esquerda; se a direção do texto for de direita para esquerda, o alinhamento é à direita):

Exemplo

h1 {
  text-align: center;
}
h2 {
  text-align: left;
}
h3 {
  text-align: right;
}

Experimente você mesmo

quando text-align Depois de configurar a propriedade como "justify", cada linha será esticada para ter uma largura igual, e os margens laterais serão retas (como em revistas e jornais):

Exemplo

div {
  text-align: justify;
}

Experimente você mesmo

Direção do texto

direction e unicode-bidi A propriedade pode ser usada para alterar a direção do texto do elemento:

Exemplo

p {
  direction: rtl;
  unicode-bidi: bidi-override;
}

Experimente você mesmo

Alinhamento vertical

vertical-align A propriedade define o alinhamento vertical do elemento.

Este exemplo demonstra como configurar o alinhamento vertical da imagem no texto:

Exemplo

img.top {
  vertical-align: top;
}
img.middle {
  vertical-align: middle;
}
img.bottom {
  vertical-align: bottom;
}

Experimente você mesmo