A szövegeltávolító tulajdonság és a szomszédos testvérválasztók használata
A jó webdesign gyakran a jó tipográfiáról szól. Mivel az internetes oldal tartalmának nagy része szövegként jelenik meg, és képes arra, hogy a szöveg vonzóvá és hatékonyabbá váljon, fontos webes tervezői készség. Sajnos nincs ugyanolyan tipográfiai ellenőrzés az interneten, mint amit nyomtatott formában készítünk. Ez azt jelenti, hogy a weboldalon nem mindig tudunk stílusosan megfogalmazni szöveget, ugyanúgy, ahogy ezt egy nyomtatott darabban megtehetjük.
Az egyik gyakori bekezdésstílus, amelyet gyakran nyomtat (és amelyet online újra lehet készíteni), ahol a bekezdés első sorában egy fülek található . Ez lehetővé teszi az olvasók számára, hogy lássák, hol kezdődik az egyik bekezdés, és egy másik cél.
Nem látja ezt a vizuális stílust annyira a weboldalakon, mert a böngészők alapértelmezés szerint az alatta lévő helyeket jelenítik meg, hogy megmutathassák, hol végződik és egy másik kezdődik, de ha olyan oldalt szeretne létrehozni, inspirált behúzási stílust a bekezdésekben, ezt a text-indent style tulajdonság használatával teheti meg.
A tulajdonság szintaxisa egyszerű. Itt adhatja meg, hogy egy dokumentum minden bekezdéséhez szöveges szöveget adjon hozzá.
p {szöveg-indent: 2em; }A behúzások testreszabása
Az egyik mód, hogy pontos pontokat adhat meg a behúzáshoz, hozzáadhat egy osztályt a beillesztett bekezdésekhez, de ehhez meg kell szerkesztenie az összes bekezdést, hogy hozzáadjon hozzá egy osztályt. Ez nem hatékony, és nem követi a HTML-kódolási legjobb gyakorlatokat.
Ehelyett figyelembe kell vennie, amikor beilleszt egy bekezdést. Ön olyan bekezdéseket illeszt be, amelyek közvetlenül egy másik bekezdést követnek. Ehhez használhatja a szomszédos testvérválasztót. Ezzel a választógombbal minden bekezdést kiválaszt, amelyet közvetlenül egy másik bekezdés előz meg.
p + p {szöveg-indent: 2em; }Mivel az első sort behúzza, gondoskodnia kell arról is, hogy a bekezdéseknek ne legyen több szabad helyük (amely a böngésző alapértelmezett). Stílusosan, vagy legyen hely a bekezdések között vagy az első sort illessze be, de nem mindkettőt.
p {margin-bottom: 0; padding-bottom: 0; } p + p {margin-top: 0; padding-top: 0; }Negatív behúzások
A szöveges dőlés tulajdonságot is használhatja negatív értékkel együtt, így a vonal kezdete balra, a jobbhoz hasonlóan, mint egy normál behúzás. Ezt akkor teheti meg, ha egy sor egy idézettel kezdődik, hogy a pontozó karakter a bekezdés bal oldalán lévő kis szélességben jelenjen meg, és a betűk még mindig szép bal oldali igazítást eredményeznek.
Mondja például, hogy van egy bekezdésed, amely egy blokkvég leszármazottja, és azt akarod, hogy negatívan behajthatók legyenek. Ezt a CSS-t írhatod:
blockquote p {szöveg-indent: -5em; }Ez a bekezdés kezdetét jelentené, amely feltételezhetően magában foglalja a nyitó idézett karaktert, hogy kissé balra mozogva lógó írásjeleket hozzon létre.
A margók és a padding tekintetében
Gyakran a webes tervezésnél az elemek mozgatásához margó- vagy kitöltési értékeket használ fel, és fehér területet hoz létre. Azonban ezek a tulajdonságok nem fognak működni az indított bekezdés hatás elérése érdekében. Ha ezek közül az értékek valamelyikét alkalmazza a bekezdésre, a bekezdés teljes szövege, beleértve minden sort, csak az első sor helyett.