Rövid útmutató a mértékegységeket a css, css
CSS mértékegységek elengedhetetlen a weboldalak létrehozását és méretezése a különböző elemek. CSS értékek fejezhető pozitív vagy negatív szám, bár egyes szálláshelyeken csak pozitív számok. A számérték kíséri kétbetűs rövidítése, amely képviseli a tényleges egység hossza. Például cm (centiméter), képpont (pixel) vagy em CSS. Kivétel ez alól a szabály értéke 0 (nulla), ami nem kell, hogy adja meg az egységet.
CSS mértékegységek kétfélék: abszolút és relatív.
Abszolút hosszúságú egységek CSS
Abszolút CSS egységek nem alkalmasak web design. Ők képviselik a számszerű megjelölése, a mérési eredmények a fizikai világban, és nem függ a méret és a képernyő felbontását. Abszolút hossza egy és ugyanaz az érték eltérhet különböző képernyőkön. Ezt az okozza, hogy a különbség a képernyőn DPI (dots per inch).
Nagy felbontású képernyők magasabb DPI, mint az alacsonyabb felbontású képernyők, így a kép és a szöveg kisebbé. Abszolút egységek meghatározásához használt stílusok a nyomdaiparban, ahol a mérés inch-ben, pontok és csúcsokat.
Most abszolút hosszúság egységek használhatatlanok az interneten. Az egyetlen kivétel az px. A képpontok relatív egységek tekintetében a felbontás a képernyőkön. Nyomtatók és kijelzők nagy felbontású egy pixel egyenlő CSS több pixel a képernyőn, hogy a több px per inch körülbelül 96. A pixel a legkisebb mértékegység, és általában referenciaként mások számára.
Relatív hosszúságú egységek CSS
Relatív, hogy a CSS hossza egységeket nem rögzített értékeket. Értékük függ más megadott értékek vagy funkciókat. Ezek nagyobb a kereslet a web design, mert megkönnyíti a meghatározást az elem méretét. Ezeket fel lehet használni, hogy állítsa be a szélesség, magasság, betűméret, stb. E. Relatív, hogy a többi alapvető paramétereket.
Relatív egységek, attól függően, hogy a font
Relatív mértékegységek, attól függően, hogy a betűtípust, lásd egy előre meghatározott betűméret vagy az érték a font-family:- ex (magasság x szimbólum);
- ch (a szélessége a nulla szimbólum (0));
- em egység CSS (font magassága ez az elem);
- rem (betűméretét a gyökér elem).
Definíció szerint „a karakter magassága x az aktuális font vagy fél 1 em”. Ez a magasság kisbetűvel: x telepített betűtípust. Ha az ingatlan értéke változik font-family ex mérőegység megváltozik.
Karakter szélessége megegyezik 0. Ez az intézkedés is változik, a az ingatlan értéke font-family.
Egység em CSS értéke egyenlő a betűméret a fő vagy a szülő. Például, ha a szülő elem betűméret 30px. 1em az értéket kell kiszámítani, mint 30px (30 x 1) az összes gyermek elemek. A szám nem kell egy egész szám. Ha cserélni 1em példában 0,5, az érték 15 képpont (30 x 0,5).
Egység em értéket vesz címke a szülő. Ez ahhoz vezethet, hogy a nemkívánatos eredmények használatával beágyazott elemeket.
Tegyük fel, hogy van három beágyazott elem. Az első bejegyzés (root) van 30px betűméretet. és két al-elem - betűtípust a 2em. Van ágyazva a gyökér lesz egy betűméretet, számítva 60 képpont (30 x 2). A tag beágyazva, lesz egy betűméretet, számítva 120 képpont (60 x 2).
rem hasonló em CSS. de annak értéke mindig megegyezik a betűméretet a gyökér elem. rem Mértékegység hasznos tervezése során adaptív weboldalak, mert lehetővé teszi, hogy a skála teljes oldalt, változtassa meg a betűméretet a HTML-elem.
érdeklődés%
A távolság előre meghatározott százaléka függ a hossza a szülő elem. Például, ha a szülő elem 1000px szélességű. és annak gyermek eleme - 50% -os értékét, a szélessége a leányvállalata elem 500px.
böngésző támogatása
em CSS, ex, px, cm, mm,, pt, és pc
Ez a szolgáltatás minden böngésző, köztük régebbi verziói IE.
Minden használt böngésző, köztük IE9 +.
vw, vh és vmin
Chrome 20+. IE 9 +. Firefox 19+. Safari 6. Opera 20+. Az Internet Explorer támogatja Vmin szokatlan szintaxis vm.
Chrome 20+. Firefox 19+ és 20+ Opera és a Safari 6.1+. Nem támogatja az IE.
Fordítása a cikk „A Rövid útmutató a CSS hosszegységnek” készítettünk egy csapat barátságos Web design projekt tól Z-ig