Tekstijäljega vara ja sellega kaasnevate sugulasliikmete kasutamine
Hea veebidisain on sageli hea tüpograafia kohta. Kuna nii palju veebisaidi sisu esitatakse teksti kujul, on see stiil, mis on nii atraktiivne kui ka efektiivne tekst, on oluline oskus veebidisaineri omandamiseks. Kahjuks ei ole meil trükikoja kontrolli sama taset, mida me printida. See tähendab, et me ei saa alati usaldusväärselt stiili teksti veebisaidil samamoodi nagu trükitud kujul teha.
Üks ühine lõikustüüp, mida te näete tihti printides (ja mida me saame internetis uuesti luua), on selle lõike esimene rida, kus on üks vaheleht . See võimaldab lugejatel näha, kus algab üks lõik ja teine lõpeb.
Sa ei näe seda visuaalset stiili nii palju kui veebilehti, sest brauserid kuvavad vaikimisi parameetrid parameetritega ruumi nende all, et näidata, kus üks lõpeb, ja teine algab, kuid kui soovite seda lehte trükkida, lõikudes inspireeritud taande stiil, saate seda teha teksti tausta stiili omadustega.
Selle vara süntaks on lihtne. Siin on, kuidas lisada dokumendi kõikidele punktidele tekst-taane.
p {teksti-taane: 2em; }Taanete kohandamine
Üks viis, mille abil saate täpselt täpsustada lõigud taanet, saate lisada klassi lõigudesse, kuhu soovite taandrida, kuid see nõuab, et muudaksite iga lõigu, et lisada sellele klass. See on ebaefektiivne ja ei järgi HTML-i kodeerivaid parimaid tavasid.
Selle asemel peaksite kaaluma, millal lõiked sisestatakse. Te sisestad lõike, mis järgivad otseselt mõnda teist lõiku. Selleks võite kasutada külgnevat vendade valijat. Selle valijaga valite iga lõike, millele eelneb vahetult teine lõik.
p + p {text-indent: 2em; }Kuna olete esimese rea taandrida, peate ka veenduma, et teie lõigetes pole nende vahel rohkem ruumi (mis on brauseri vaikeväärtus). Stiililiselt peaksite olema tühikute vahekaugus või esimene rida, kuid mitte mõlemad.
p {margin-bottom: 0; padding-bottom: 0; } p + p (margin-top: 0; padding-top: 0; }Negatiivsed taanded
Võite kasutada ka tekstindeksi vara koos negatiivse väärtusega, et tekitada rea algus vasakule minemiseks, selle asemel et parem kui tavaline taane. Te võite seda teha, kui rida algab jutumärgiga, nii et tsiteerinumber kuvatakse paragrahvi vasakpoolses väikeses servas ja tähed jäävad siiski endiselt heaks vasakpoolseks joonduseks.
Öelge näiteks, et teil on lõik, mis on plokkveo järeltulija ja soovite, et see oleks negatiivselt taandrutatud. Sa võiksid kirjutada selle CSS:
pühakiri p {teksti-taande: -5em; }See annaks lõike alguse, mis eeldatavasti sisaldab avamise tsitaadi tähist, et seda pisut nihutada vasakule, et luua rippuvad kirjavahemärgid.
Marginaalide ja padding
Tihti veebidisainis kasutate elementide liigutamiseks marginaali või padjandi väärtusi ja loote tühikuid. Kuid need omadused ei toeta taandrutatud lõike efekti. Kui te rakendate mõnda neist väärtustest lõikele, paigutatakse kogu esimese lõigu tekst, sealhulgas iga rida, ainult esimese rea asemel.