Come indentare il testo del paragrafo in HTML/CSS

Hai bisogno di indentare il testo in un elemento HTML? Puoi indentare la prima riga di un paragrafo usando i CSS!,

Ecco come si può fare:

rientrare la prima riga di un paragrafo con text-indent

diciamo che hanno un po ‘ di testo in un paragrafo come questo:

<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>

È possibile utilizzare la proprietà CSS text-indent per rientrare la prima riga di una specifica lunghezza:

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

Ed ecco ciò che sarà simile a:

Come gli altri CSS proprietà di lunghezza, è possibile utilizzare qualsiasi unità che si desidera. Pixel (px), em, rem, anche percentuale ( % ) unità funzioneranno.,

Utilizzando un’unità relativa come percentuale cambierà la quantità di rientro in base alla larghezza della pagina web. Più ampia è la pagina web, più grande sarà il rientro.

Puoi anche aggiungere un valore negativo text-indent se vuoi, per far sì che la prima riga sporga a sinistra.,

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

Ecco ciò che il rientro negativo sarà simile in un paragrafo:

Utilizzare il margine a sinistra, se si desidera che l’intero paragrafo per essere spostata a destra

Se si desidera che l’intero paragrafo per essere cambiata, non solo la prima riga, quindi è possibile utilizzare il margin-left proprietà.

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

Ecco come sarà., Il primo paragrafo non viene spostato e il secondo paragrafo è:

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *