CSS - text-indent

Descrição

A propriedade text-indent define uma distância de recuo para a primeira linha de texto em um elemento de nível de bloco.

Valores possíveis

  • length- Qualquer valor de comprimento. Comprimentos negativos são permitidos para a propriedade e produzirão um efeito de "recuo suspenso".

  • percentage - A primeira linha do texto é recuada por uma distância relativa à largura do bloco que o contém.

Aplica-se a

Todos os elementos de nível de bloco.

Sintaxe DOM

object.style.textIndent = "20px";

Exemplo

A seguir está o exemplo que demonstra como indentar a primeira linha de um parágrafo -

<html>
   <head>
   </head>

   <body>
      <p style = "text-indent:1cm;">
         This text will have first line indented by 1cm 
      </p>
      
      <p style = "text-indent:1cm;">
         this line will remain at its actual position this is done by 
         CSS text-indent property.
      </p>
   </body>
</html>

Isso produzirá o seguinte resultado -