betűméret css em, px, pt, vagy százalékos

Használata font-size tulajdonság a méretezés a szöveget az egyik legnehezebb feladata a stílus CSS. CSS kínál négy egység méretének mérése a szöveg jelenik meg egy webböngészőt. Az alábbiak közül melyik négy egység a legalkalmasabb a webes dokumentumok? Ez a kérdés okozott sok vita van. Ahhoz, hogy határozott választ adni erre a kérdésre nehéz.

Ismerje meg az egység

Em (em): em egy skálázható egység, amely a webes dokumentumokat. Egy em egyenlő az aktuális betűméret. Például, ha egy dokumentum betűméret 12pt. 1em egyenlő 12pt. Mivel em átugrott a 2em egyenlő 24pt. 5em egyenlő 6PT, stb Köszönhetően a skálázhatóság és a magas kompatibilitás mobil eszközök, em egyre inkább használják a webes dokumentumok.

Pixel (képpont): A pixelek egységek rögzített méretű használt minden, ami olvasni a számítógép képernyőjén. Egy pixel értéke egy pontot a képernyőn (a legkisebb részlege a felbontása a képernyőn). Sok webes tervezők használja a webes dokumentumok pixel, hogy ha böngészőben tekinti a honlap nézett tökéletes szempontjából pixel. Az egyetlen probléma az, hogy a pixelek nem növelhető a kényelem az olvasók a gyenge látás vagy csökkent az egyszerű olvasó mobileszközökön.

Pontban (pt): Pont hagyományosan használnak a nyomtatott médiában (vagyis minden, ami a papírra nyomtatott). Egy pont értéke 1/72 hüvelykkel. A pontok nagyon hasonlít a pixelek úgy, hogy van egy fix méretű, és nem a nagyítás / kicsinyítés.

Százalék (%): A százalékos egy csomó, mint em. kivéve néhány alapvető különbség. Először is, a jelenlegi betűméret 100% (azaz 12pt = 100%). Segítségével néhány százalékkal lehetővé teszi, hogy növelje / csökkentse a szöveget az olvashatóság.

Mi a különbség?

A különbség ezek az egységek könnyen érthető néhány konkrét példát. Itt van, hogyan viszonyulnak egymáshoz: 1em = 12pt = 16px = 100%. Lássuk, mi történik, ha növeljük az alap betűméretet (a CSS-választó testület) 100% -ról 120%.

Mint látható, Em és százalékos növekedés, mint az alap betűméret és a pixel és pont - nincs. Könnyen használható abszolút nagysága a szöveg, de ez sokkal könnyebb használni skálázható megjelenő szöveg bármilyen eszközön. Ezért a szöveg egy web dokumentum előnyösebb használni a készüléket Um és a kamatot.

EM vagy százalékos?

Azt találtuk, hogy a pont és a pixel nem a legjobb egység a webes dokumentumok. Tehát mi maradt Em és százalékban. Elméletileg, Em és kamat - ugyanaz az egység, de a gyakorlatban, köztük vannak kisebb különbségek, amelyeket nem lehet figyelmen kívül hagyni.

A fenti példában az általunk használt néhány százalékkal, mint a bázis betűméretet (a body tag). Ha megváltoztatja a bázis betűméretet, kamatokkal együtt a GM (azaz a test ), A különbség akkor valószínűleg nem veszi észre. Lássuk, mi történik, ha a betűméret a test 1em. és ha az ügyfél megváltoztatja a böngésző beállítása „Text Size” (ez a beállítás elérhető az egyes böngészők, mint az Internet Explorer).

Amikor a szöveg méretét az ügyfél böngésző úgy van beállítva, hogy az „átlagos» (közepes), a GM és a százalékos különbség volt megfigyelhető. De ha ezt a beállítást, akkor a különbség észrevehető. A konfigurálás során a „Legkisebb» (legkisebb) Em sokkal kisebbek, mint a százalékos. És amikor beállítja „A legnagyobb» (Legnagyobb) minden fordítva - Um sokkal több, mint érdekes. Azt mondhatjuk, hogy a készülék Em skála, hiszen meg kell csinálni, de a gyakorlatban egy ilyen szöveg skálázódik túl élesen, és az egyes készülékek, a legkisebb szöveget olvashatatlanná válik.

Elméletileg, egy egységet a GM egy új szabvány a webes dokumentumok betűméret, de a gyakorlatban kiderül, hogy néhány százalékkal több felhasználóbarát. Ha megváltoztatjuk a kliens beállításait, szöveg, amely egy egységnyi százalékos méretezhető megfelelően, amely lehetővé teszi a tervezők, hogy fenntartsák az olvashatóság, a hozzáférhetőség és a látványterv.

Győztes: százalékos (%).

Általában, ha létrehozok egy új design, a body elem használom százalékos (body ), Majd használja őket a további méretezés. Mindaddig, amíg a beállítások, amelyek a test néhány százalék, akkor akár százalékban vagy em bármely más szabályok és CSS szelektor, és egyúttal élvezze az előnyöket kínált a használata százalékkal bázis betűméretet.

Az elmúlt néhány évben ez a gyakorlat nagyon gyakori lett a web design.
A pixelek most használják elfogadható betűméret egységek (értsd kis szöveg, a felhasználók használhatják a „zoom” böngésző). Azonban az pixelek azért problematikus, mert a mobil eszközök képernyői igen magas pixelsűrűség (néhány Android iPhone készüléket, és sűrűsége 200-300 pixel per inch, ami miatt betűtípusok 11 képpont és 12 rosszul megkülönböztethető). Szóval, én továbbra is használhatja a százalékos alap betűméret webes dokumentumokat.