Hea veebidisain räägib sageli heast tüpograafiast. Kuna nii suur osa veebisaidi sisust esitatakse tekstina, on selle teksti kujundamine nii atraktiivseks kui ka tõhusaks kujundamiseks oluline oskus. Kahjuks pole meil võrgus samal tasemel tüpograafilist juhtimist kui trükituna. See tähendab, et me ei saa alati veebisaidi teksti usaldusväärselt stiilida samamoodi, nagu võiksime seda teha trükituna.
Üks levinud lõigu stiil, mida näete sageli trükituna (ja mille saame võrgus uuesti luua), on selle lõigu esimene rida taandatud vahelehe tühik. See võimaldab lugejal näha, kus algab üks lõik ja teine lõpeb.
Te ei näe seda visuaalset stiili nii palju veebilehtedel, kuna brauserid kuvavad vaikimisi lõigud tühikuga nende all, et näidata, kus üks lõpeb ja teine algab, kuid kui soovite lehte selle kujundamiseks kujundada trükist inspireeritud taande stiil lõikudel saate seda teha teksti taane stiilis vara.
Selle omaduse süntaks on lihtne. Nii lisate teksti taande kõigile dokumendi lõikudele.
p {
teksti taane: 2em;
}
Taanete kohandamine
Ühel viisil saate täpselt taandatavad lõigud määratleda, võite lisada taandatavatele lõikudele klassi, kuid see nõuab iga lõigu muutmist, et sellele klass lisada. See on ebaefektiivne ja seda ei järgne HTML-i kodeerimine parimad tavad.
Selle asemel peaksite mõtlema lõigete taandumisel. Taandate lõike, mis järgneb otse teisele lõigule. Selleks saate kasutada kõrval asuvat õdede-vendade valijat. Selle valija abil valite iga lõigu, millele eelneb vahetult teine lõik.
p + p {
teksti taane: 2em;
}
Kuna taandate esimest rida, peaksite ka veenduma, et teie lõikudel pole nende vahel lisaruumi (mis on brauseri vaikimisi). Stiililiselt peaks lõikude vahel olema ruumi või esimese taande taane, kuid mitte mõlemad.
p {
veerise põhi: 0;
polsterduspõhi: 0;
}
p + p {
ülemine serv: 0;
polster: 0;
}
Negatiivsed taanded
Võite kasutada ka teksti taane omadus koos negatiivse väärtusega põhjustab rea alguse vasakule vastupidi paremale nagu tavaline taane. Seda saate teha, kui rida algab jutumärgiga, nii et tsitaadimärk ilmub väike varu lõigust vasakul ja tähed ise moodustavad endiselt kena vasakpoolse osa joondamine.
Oletame näiteks, et teil on lõik, mis on blokeeritud pakkumise järeltulija, ja soovite, et see oleks negatiivselt taandatud. Võite kirjutada selle CSS:
plokkpakkumine p {
teksti taane: -.5em;
}
See annaks lõigu alguse, mis eeldatavalt sisaldab ka tsitaadimärki, rippuvate kirjavahemärkide loomiseks veidi vasakule.
Marginaalide ja polsterduse kohta
Veebikujunduses kasutate sageli veerise või täidise väärtused elementide teisaldamiseks ja tühiku loomiseks. Need omadused ei tööta taandatud lõiguefekti saavutamiseks. Kui rakendate lõikele kumbagi neist väärtustest, paigutatakse selle lõigu kogu tekst, kaasa arvatud kõik read, esimese rea asemel eraldi.