cum să indentați textul paragrafului în HTML / CSS

trebuie să indentați textul într-un element HTML? Puteți indenta prima linie a unui paragraf folosind CSS!,

Iată cum puteți face asta:

Indent prima linie a unui paragraf cu un text-indent

Să presupunem că aveți un text într-un paragraf de genul asta:

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

puteți folosi proprietate CSS text-indent pentru a indenta prima linie de o anumită lungime:

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

Și aici e ceea ce va arata ca:

Ca și alte CSS lungime proprietăți, puteți folosi orice unitate pe care doriți pentru acest lucru. Pixeli (px), em, rem, chiar procent ( % ) unități vor funcționa.,

folosind o unitate relativă ca procent va schimba cantitatea de indentare în funcție de lățimea paginii web. Cu cât pagina web este mai largă, cu atât va fi mai mare liniuța.

Puteți adăuga chiar și o valoare negativă text-indent dacă doriți, pentru a face ca prima linie să rămână în stânga.,

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

Aici e ceea ce negativ liniuță va arata ca într-un paragraf:

Utilizarea margin-left dacă doriți întregul paragraf să fie mutat de la dreapta

Dacă doriți întregul paragraf să fie mutat de peste, nu doar prima linie, apoi, puteți utiliza margin-left proprietate.

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

Iată cum va arăta., Primul paragraf nu este deplasat peste, și al doilea paragraf este:

Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *