Unități CSS
CSS are mai multe unități diferite pentru a exprima o lungime.
Multe proprietati CSS ia "length" valori, cum ar fi latimea, marja, padding, font-size, border-width, etc.
Lungimea este un număr urmat de o unitate de lungime, cum ar fi 10px, 2em etc.
Un spațiu gol nu poate apărea între numărul și unitatea. Cu toate acestea, în cazul în care valoarea este 0, unitatea poate fi omisă.
Pentru unele proprietăți CSS, sunt permise lungimi negative.
Există două tipuri de unități de lungime: relative și absolute.
Suport pentru browser-
Numerele din tabel specifica prima versiune de browser care acceptă pe deplin unitatea de lungime.
Unitatea Lungime | |||||
---|---|---|---|---|---|
em, ex, %, px, cm, mm, in, pt, pc | 1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
ch | 27,0 | 9 | 1.0 | 7 | 20.0 |
rem | 4 | 9 | 3.6 | 4.1 | 11.6 |
vh, vw | 20.0 | 9 | 19.0 | 6 | 20.0 |
vmin | 20.0 | 9.0 * | 19.0 | 6 | 20.0 |
vmax | 26.0 | Nu sunt acceptate | 19.0 | Nu sunt acceptate | 20.0 |
Note: Internet Explorer 9 suportă Vmin cu numele non-standard: vm.
Lungimile relative
Unități de lungime relative specificați o lungime în raport cu o altă proprietate lungime. Unități de lungime relative scalează mai bine între diferite medii de redare.
Unitate | Descriere |
---|---|
em | Relativ la font-dimensiunea elementului (2em means 2 times the size of the current font) de (2em means 2 times the size of the current font) Încearcă - l |
ex | Relativ la înălțimea literei x a fontului curent (rarely used) Încercați |
ch | Comparativ cu lățimea "0" (zero) |
rem | Comparativ cu font-size elementului rădăcină |
vw | Comparativ cu 1% din lățimea ferestrei de vizualizare * Încercați |
vh | Comparativ cu 1% din înălțimea imaginii curente * Încercați |
vmin | Comparativ cu 1% din viewport lui * dimensiuni mai mici Încercați |
vmax | Comparativ cu 1% din viewport lui * dimensiune mai mare Încercați |
% |
Tip: em și rem unități sunt practice în crearea de aspect perfect scalabile!
* Viewport = dimensiunea ferestrei browser-ului. În cazul în care portul de vizualizare este 50cm, 1vw = 0.5cm.
absolute Lungimi
Absolute unități de lungime sunt fixe și o lungime exprimată în oricare dintre acestea vor apărea ca exact acea dimensiune.
Unități de lungime absolute nu sunt recomandate pentru utilizarea pe ecran, deoarece dimensiunea ecranului variază atât de mult. Cu toate acestea, ele pot fi utilizate în cazul în care mediul de ieșire este cunoscut, cum ar fi de aspect al imprimării.
Unitate | Descriere |
---|---|
cm | centimetri Încercați |
mm | milimetri Încercați |
in | inch (1in = 96px = 2.54cm) Încearcă - l |
px * | pixeli (1px = 1/96th of 1in) Încercați |
pt | puncte (1pt = 1/72 of 1in) Încercați |
pc | picas (1pc = 12 pt) Încercați |
* Pixeli (px) , sunt în raport cu dispozitivul de vizualizare. Pentru dispozitivele de mici dpi, 1px este un pixel dispozitiv (dot) a ecranului. Pentru imprimante și ecrane de înaltă rezoluție 1pixel implică mai mulți pixeli dispozitiv.