Nám um leiðandi í vefhönnun

Vefhönnun hefur alltaf lánað skólastjóra og skilgreiningar úr heimi grafískrar og prentunarhönnunar. Þetta á sérstaklega við þegar kemur að vefritgerð og hvernig við fáum bréf á vefsíðum okkar. Þessar hliðstæður eru ekki alltaf 1 til 1 þýðing, en þú getur vissulega séð hvar einn agi hefur haft áhrif á hinn. Þetta er sérstaklega augljóst þegar þú telur tengslin milli hefðbundinna leturgreiningar "leiðandi" og CSS eignarinnar sem kallast "línuhæð".

Tilgangur leiðandi

Þegar fólk notaði handvirkt málm- eða tréstafir til að búa til leturgerð fyrir prentuðu síðu voru þunnir blöðrur settir á milli láréttra textalína til að skapa bil milli þeirra. Ef þú vildir stærri pláss myndi þú setja stærri stykki af blýi. Þannig var hugtakið "leiðandi" búið til. Ef þú leit upp hugtakið "leiðandi" í bók um stafræn hönnun og skólastjóra, myndi það lesa eitthvað sem hefur áhrif á - "fjarlægðin milli grunnlína af röð lína af gerð."

Leiðandi í Vefhönnun

Í stafrænni hönnun er hugtakið leiðandi enn notað til að vísa til bilsins milli textalína. Margir forrit nota þetta nákvæma orð, þótt raunveruleg leiða sé augljóslega ekki notuð í þessum forritum. Þetta er frábært dæmi um nýjar hugmyndir um lántökur hugmynda frá hefðbundnum, jafnvel þó að nákvæmlega framkvæmd þessarar reglu hafi breyst.

Þegar það kemur að vefhönnun er engin CSS eign fyrir "leiðandi". Í staðinn er CSS eignin sem myndi höndla þessa sjónskýringu texta heitir línuhæð. Ef þú vilt að textinn þinn hafi viðbótarpláss á milli lárétta textalína, þá ættirðu að nota þessa eign. Til dæmis segðu að þú vildir auka línuhæð fyrir alla málsgreinar innan

frumefnisins á vefsvæðinu þínu , þú gætir gert það svona:

helstu p {lína-hæð: 1,5; }

Þetta myndi nú vera 1,5 sinnum eðlileg línahæð, byggt á sjálfgefin leturstærð á síðunni (sem er venjulega 16px).

Hvenær á að nota línuhæð

Eins og fram kemur hér að framan er línahæð viðeigandi til að nota til að geyma línur textans í málsgreinum eða öðrum textabrotum. Ef það er of lítið bil milli lína getur textinn orðið jumbled og erfitt að lesa fyrir áhorfendur á síðuna þína. Á sama hátt, ef línurnar eru á bilinu of langt í sundur á síðunni, verður venjulegt rennsli rennt niður og lesendur munu eiga í vandræðum með textann af þeirri ástæðu. Þess vegna viltu finna viðeigandi magn af línuhæðarmörkum til notkunar. Þú getur einnig prófað hönnunina þína með raunverulegum notendum til að fá álit sitt á læsileiki síðunnar .

Þegar ekki á að nota línuhæð

Ekki rugla á línuhæð með púða eða marmun sem þú vilt nota til að bæta hvítu í hönnunarsíðu þína, þ.mt undir fyrirsögn eða málsgreinar. Það bil er ekki leiðandi og því er það ekki meðhöndlað af línuhæð.

Ef þú vilt bæta við plássi undir ákveðnum textaþætti, þá ættirðu að nota margar eða púðar. Fara aftur til fyrri CSS dæmi sem við notuðum, við gætum bætt þessu við:

helstu p {lína-hæð: 1,5; framlegð-botn: 24px; }

Þetta hefði ennþá 1,5 lína hæð milli textalína fyrir málsgrein síðunnar (þær sem eru inni í

þátturinn). Þessir sömu málsgreinar myndu einnig hafa 24 punkta af hvítum undir hverri þeirra og leyfa sjónrænum hléum sem leyfa lesendum að auðveldlega greina eitt málsgrein frá öðru og gera vefleit auðveldara að gera. Þú getur líka notað padding eign í stað margra hér:

helstu p {lína-hæð: 1,5; púði-botn: 24px; }

Í næstum öllum tilvikum myndi þetta sýna það sama og fyrri CSS.

Segðu að þú vildir bæta við bili undir listatölum sem voru inni í listanum með bekknum "þjónustu-valmynd", myndirðu nota margar eða padding til að gera það, EKKI línuhæð. Svo þetta væri viðeigandi.

. þjónustu-valmynd li { Þú ættir aðeins að nota línuhæð hér ef þú vilt setja bilið á textanum inni í listatölunum sjálfum, að því tilskildu að þær hafi langar keyrslur af texta sem gætu keyrt í margar línur fyrir hvert skotpunkt.