A webdesign mindig követelte a grafikai és nyomtatási dizájn világát. Ez különösen igaz a webes tipográfiára és arra, ahogyan levelezési formákat kapunk a weboldalainkon. Ezek a párhuzamok nem mindig 1-1 fordítások, de bizonyára megnézhetjük, hogy az egyik tudomány milyen hatással volt a másikra. Ez különösen akkor nyilvánvaló, ha figyelembe vesszük a "vezető" és a CSS tulajdonság "vonalmagasság" néven ismert kapcsolatát.
A vezetés célja
Amikor az emberek manuálisan fém vagy fából készült betűket használtak annak érdekében, hogy egy nyomtatott oldal tipográfiáját hozzák létre, vékony ólomdarabokat helyeztek el a vízszintes szövegsorok között, hogy e sorok közötti távolságot hozzanak létre. Ha nagyobb helyet akarnál, akkor nagyobb ólomdarabokat helyezhetsz be. Így született a "vezető" kifejezés. Ha a tipográfiai tervezésről és a megbízókról szóló könyvben a "vezető" kifejezést kereste, akkor valami olyasmit olvashatna, amely "az egymást követő sortípusok alapvonala közötti távolságot" jelentette.
Vezető a webes tervezésben
A digitális tervezésben a vezető kifejezés még mindig a szövegsorok közötti távolságra utal. Számos program használja ezt a pontos kifejezést, annak ellenére, hogy a valódi ólom nyilvánvalóan nem használatos ezeken a programokon. Ez egy nagyszerű példa a hagyományos módszerek kölcsönzésének új formáira, annak ellenére, hogy ennek az elvnek a pontos végrehajtása megváltozott.
Amikor a webdesignot érjük el, nincs CSS-tulajdonság a "vezető" számára. Ehelyett a CSS-tulajdonságot, amely kezeli ezt a vizuális szövegmegjelenítést, a vonalmagasságnak nevezik. Ha azt szeretné, hogy a szövegnek további területe legyen a vízszintes szövegsorok között, használja ezt a tulajdonságot. Tegyük fel például, hogy a webhely
Ez most 1,5-szerese a normál vonalmagasságnak, az alapértelmezett betűméret alapján (általában 16px).
Mikor használják a vonalmagasságot?
Amint azt a fentiekben részleteztük, a vonalmagasság alkalmas arra, hogy a szövegsorokat bekezdésekben vagy más szövegblokkokban helyezze el. Ha a vonalak között nincs túl nagy szórás, a szöveg megzavarodhat, és a látogatók számára nehezen olvasható. Hasonlóképpen, ha a vonalak túlságosan egymástól távol vannak egymástól, akkor az olvasás normális áramlata megszakad, és az olvasóknak ezért nehéz lesz a szövegük. Ezért szeretné megtalálni a megfelelő mennyiségű vonalmagasságot a használathoz. Ön is tesztelheti tervét a tényleges felhasználókkal, hogy visszajelzést kapjon az oldal olvashatóságáról .
Ha nem használja a vonalmagasságot
Ne tévessze össze a vonalmagasságot a párnázattal vagy a margókkal, amelyekkel felveheti a fehérek méretét az oldala dizájnjához, ideértve a címsor vagy bekezdések alatt. Ez a távolság nem vezet, ezért nem kezeli a vonalmagasság.
Ha bizonyos szövegelemek között helyet szeretne felvenni, akkor margókat vagy betöltést használhat. Visszatérve az előző CSS példához, amit használunk, hozzáadhatnánk ezt:
fő p {line-height: 1.5; margin-bottom: 24px; } Ennek továbbra is 1,5 soros magassága lenne az oldalunk bekezdésének szövegsorai között (a
Szinte minden esetben ez ugyanazt jelentené, mint az előző CSS.
Tegyük fel, hogy a "szolgáltatások-menü" osztályt tartalmazó listán belüli listákat szeretnénk hozzáadni a listához, akkor a margókat vagy a párkányt használnánk, NEM vonalmagassága. Tehát ez megfelelő lenne.
.szolgáltatások-menü li {