como indentar o texto do parágrafo no HTML / CSS

precisa indentar o texto em um elemento HTML? Você pode indentar a primeira linha de um parágrafo usando CSS!,

Aqui está como você pode fazer isso:

Recuar a primeira linha de um parágrafo com texto de recuo

Vamos dizer que você tem algum texto em um parágrafo como este:

<p class="indent"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa sit aperiam deserunt quae excepturi fugit, consequuntur cum corporis illum natus quibusdam quasi ab at. Laboriosam aperiam aut laborum animi soluta eligendi iste doloribus error, ex eius magnam? Aperiam illum nam cupiditate omnis. Repudiandae doloribus voluptatibus, animi quas incidunt eveniet fugiat!</p>

Você pode usar a propriedade CSS text-indent recuar a primeira linha de um comprimento específico:

p.indent { text-indent: 30px;}

E aqui está o que que vai olhar como:

Como outras comprimento de CSS propriedades, você pode usar qualquer unidade que você deseja para este. Pixels (px), em, rem, até mesmo unidades percentuais ( % ) funcionarão.,

usando uma unidade relativa como porcentagem irá alterar a quantidade de indentação com base na largura da página web. Quanto maior for a página web, maior será a indentação.

pode até adicionar um valor negativo

se quiser, para fazer a primeira linha sobressair para a esquerda.,

p.indent { text-indent: -30px;}

Aqui está o que o recuo negativo vai olhar como em um parágrafo:

Usar margem-esquerda se você quer a todo o parágrafo para ser deslocado para a direita

Se você deseja que o parágrafo inteiro para ser mudada, e não apenas a primeira linha, em seguida, você pode usar o margin-left propriedade.

p.shifted { margin-left: 30px;}

Aqui está o que vai parecer., O primeiro parágrafo não é mudada, e o segundo parágrafo é:

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *