Propriedade text-indent
A propriedade text-indent é usado para especificar o recuo (ou afastamento) da primeira linha de um bloco de texto. Ela define a distância entre a margem esquerda do elemento contendo o texto e o início do conteúdo do texto na primeira linha.
Valor da propriedade text-indent
-
<length>: Um valor numérico que representa a distância de recuo em unidades absolutas, como pixels ou ems. -
<percentage>: Uma porcentagem do contêiner que define a largura da caixa do elemento pai.
Exemplos
Recuo fixo
.paragrafo-indentado {
text-indent: 20px; /* Recua a primeira linha em 20 pixels */
}
.lista-indentada {
text-indent: 2em; /* Recua a primeira linha em 2 vezes o tamanho da fonte do elemento */
}Recuo percentual
.paragrafo-percentual {
text-indent: 10%; /* Recua a primeira linha em 10% da largura do contêiner */
}Recuo com valores negativos
.destaque-negativo {
text-indent: -15px; /* Move a primeira linha para fora da margem esquerda */
}