Cume in indent Paragrafi cù CSS

Utilizà a pruprietà di Text-Indent è i selezziunati di l'amici Adiacenti

Un bonu diseiu web hè spessu nantu à a tipulazione bona. Siccomu quantu di un cuntenutu di a pagina web hè prisentatu cum'è testu, pudendu stilu chì u testu per esse attraente è effettue hè una impurtante sperienza per avè pussutu com'è web designer. Sfortunatamente, ùn avemu micca u stessu livellu di cuntrollu tipulogicu in linea chì facemu in print. Questu significa chì ùn pudemu micca sempre stile di modu di modu fiduciale nantu à una pàgina web in u listessu modu chì pudemu pudemu fà in un pezzu stampatu.

Un altru paràgradu cumuni chì vi vede spessu in stampa (è quale pudemu riaccerai in linea) hè quandu a prima linea di quellu paràgraf hè indiziatu un spaziu di tabulazione . Questu permette à i lettori verificà induve un paràgrafu è un altra finisci.

Ùn avete micca questu st'età visuale cum'è in i pagine web, perchè i navigatori, per una manera predeterminada, viso paragrafi cù spaziu per elli sottu à elli com'è una manera di dimustrà u cumu si finita è un altru principia, ma se vulete stile una pàgina per avè l'impegatoghja- stile inspirame nantu à i paragrafi, pudete fà cumu cù a prughjettu di stile di testu .

A sintassi per questa propria hè simplice. Eccu cumu aghjunghje un indentazione di testu per tutti i paragrafi in un documentu.

p {text-indent: 2em; }

Customizing the Indent

Una manera ch'è pudete spiegà esemplamente i paragrafi à indizju, pudete aghjunghje una classe à i paragrafi chì vulemu indiziatu, ma questu eseguisce chì mudificà tutti i paràgrafi per aghjunghje una classa à questu. Hè ineffizjenti è ùn seguita micca i pratichi megliati di codificazione HTML .

Invece, vi cunzidiremate quandu avete i paragrafi. Puderete paragrafi chì sò direttamente un paràgrafu. Per fà questu, pudete utilizà u selettore di u fruttu adjale. Cù questu selettore, sete sceglie tutti i paràgrafi chì hè immediatamente precedutu da un altru paràgrafu.

p + p {text-indent: 2em; }

Perchè intende indenting a prima linea, avete averà dinò chì i vostri paragrafi ùn anu micca un spaziu più grande frà elli (chì hè u pianu di navigatore). Stilisticamenti, avete da esse unu spaziu entre i paragrafi o indentà a prima linea, ma micca i dui.

p {margin-bottom: 0; padding-bottom: 0; } p + p {margin-top: 0; padding-top: 0; }

Negative Indent

Pudete ancu aduprà a pruprietariu di testu , cù un valor negativu, per causà l'iniziu di una linea per andà in a manca in uppusizione à a diritta com'è una indentazione normale. Pudete fà questu quì una linea principia cù una marca di citedità per quessa chì u caratteru di quote si prisenta in u ligu marginale à a manca di u paràgrafu è e lettere sò sempre una bella alineazione di u latu.

Dite, per esempiu, chì avete un paràgrafu chì hè un discendenti di un blockquote è chì vulete ch'ellu sia indiziatu. Pudete scrive stu CSS:

blockquote p {text-indent: -.5em; }

Questu dà u principiu di u paràgrafu, chì presumibuli cumprendi u caratteru di quote di apertura, per esse ligeramenti movedatu versu l'upertu per creà punte puntu.

Regali Margini è Padding

Oftentimes in u web designu, utilizate marghjini o valors di padding per movimenti elementi è creanu spazi biancu. Quelli pussibuli ùn sanu micca pè ottene l'effettu di paragrafi indentati. Se applicate quellu di questi valuri à u paràgrafu, u testu tutale di quellu paràgrafu, cumprendu ogni linia, sarà spaziatu invece di solu a prima linea.