Ko gradite spletno stran, večina strokovnjakov priporoča, da pisave (in pravzaprav vse) določite z relativno mero, kot so ems, exs, odstotki ali slikovne pike. To pa zato, ker res ne poznate vseh različnih načinov, kako bi si nekdo lahko ogledal vašo vsebino. Če uporabite absolutno mero (palci, centimetri, milimetri, točke ali pike), bo to lahko vplivalo na prikaz ali berljivost strani v različnih napravah. In W3C priporoča da za velikosti uporabljate ems.
Toda kako velik je em?
Glede na W3C em:
"je enako izračunani vrednosti lastnosti 'font-size' elementa, na katerem je uporabljen. Izjema je, ko se 'em' pojavi v vrednosti same lastnosti 'font-size', v tem primeru pa se nanaša na velikost pisave nadrejenega elementa. "
Z drugimi besedami, ems nimajo absolutne velikosti. Velikosti prevzamejo glede na to, kje so. Za večino spletni oblikovalci, to pomeni, da so v spletnem brskalniku, zato je pisava, visoka 1em, popolnoma enaka velikosti kot privzeta velikost pisave za ta brskalnik.
Kako visoka pa je privzeta velikost?
Nikakor ne moremo biti 100% prepričani, saj lahko stranke spremenijo svoje privzeta velikost pisave v svojih brskalnikih, a ker večina ljudi ne, lahko domnevate, da ima večina brskalnikov privzeto velikost pisave 16px. Torej večino časa 1em = 16px.Misli v slikovnih pikah, za merjenje uporabi ems
Ko veste, da je privzeta velikost pisave 16 slikovnih pik, lahko s pomočjo ems-a svojim strankam omogočite enostavno spreminjanje velikosti strani, vendar razmišljajo v slikovnih pik za velikost pisave. Recimo, da imate strukturo velikosti približno tako:
- Naslov 1 - 20 slikovnih pik
- Naslov 2 - 18 slikovnih pik
- Naslov 3 - 16 slikovnih pik
- Glavno besedilo - 14 slikovnih pik
- Podbesedilo - 12 slikovnih pik
- Opombe - 10 slikovnih pik
Tako bi jih lahko določili z uporabo pikslov za merjenje, toda potem uporabnik IE 6 in 7 ne bi mogel dobro spremeniti velikosti vaše strani. Torej bi morali velikosti pretvoriti v ems, to pa je le nekaj matematike:
- Naslov 1 - 1,25em (16 x 1,25 = 20)
- Naslov 2 - 1.125em (16 × 1.125 = 18)
- Naslov 3 - 1em (1em = 16px)
- Glavno besedilo - 0.875em (16 x 0.875 = 14)
- Podbesedilo - 0,75em (16 x 0,75 = 12)
- Opombe - 0.625em (16 x 0.625 = 10)
Ne pozabite na dedovanje!
Ampak to še ni vse, kar je pri emsu. Druga stvar, ki si jo morate zapomniti, je, da prevzamejo velikost starša. Torej, če imate ugnezdene elemente z različnimi velikostmi pisave, lahko dobite veliko manjšo ali večjo pisavo, kot pričakujete.
Na primer, morda imate tabelo slogov, kot je ta:
Tako bi nastale pisave 14px in 10px za glavno besedilo oziroma opombe. Če pa v odstavek vstavite opombo, boste na koncu dobili besedilo, ki je 8,75 slikovnih pik in ne 10 slikovnih pik. Poskusite sami, postavite zgornje CSS in naslednji HTML v dokument:
Torej, ko uporabljate ems, se morate dobro zavedati velikosti nadrejenih predmetov, sicer boste na svoji strani dobili nekaj res čudnih elementov.