Jednostki CSS
CSS ma kilka różnych jednostek do wyrażania długość.
Wiele właściwości CSS podjąć "length" wartości, takie jak szerokość, marży, obicia, font-size, border-width, etc.
Długość jest liczbą następnie jednostki długości, takich jak 10px, 2em, etc.
Spacjami nie mogą pojawić się między liczbą a jednostką. Jednakże, jeśli ma wartość 0, urządzenie może zostać pominięty.
Dla niektórych właściwości CSS, negatywne długości są dozwolone.
Istnieją dwa typy jednostek długości: względne i bezwzględne.
Pomoc Browser
Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje jednostkę długości.
długość Jednostka | |||||
---|---|---|---|---|---|
em, ex, %, px, cm, mm, in, pt, pc | 1,0 | 3,0 | 1,0 | 1,0 | 3,5 |
ch | 27,0 | 9,0 | 1,0 | 7,0 | 20,0 |
rem | 4,0 | 9,0 | 3,6 | 4,1 | 11,6 |
vh, vw | 20,0 | 9,0 | 19,0 | 6,0 | 20,0 |
vmin | 20,0 | 9,0 * | 19,0 | 6,0 | 20,0 |
vmax | 26,0 | Nieobsługiwany | 19,0 | Nieobsługiwany | 20,0 |
Note: Internet Explorer 9 obsługuje Vmin z niestandardowym imię: VM.
Długości względne
Względne jednostki długości określić długość A w stosunku do innego mienia długości. Względne jednostki długości skaluje lepiej między różnymi mediami renderingu.
Jednostka | Opis |
---|---|
em | Względem font-size elementu (2em means 2 times the size of the current font) try it |
ex | W stosunku do wysokości x bieżącej czcionki (rarely used) Spróbuj |
ch | W stosunku do szerokości "0" (zero) |
rem | Względem font-size elementu głównego |
vw | W stosunku do 1% szerokości rzutni * Spróbuj |
vh | W stosunku do 1% wysokości wziernika * Spróbuj |
vmin | W stosunku do 1% rzutni * mniejszy wymiar Wypróbuj |
vmax | W stosunku do 1% rzutni * większy wymiar Wypróbuj |
% |
Tip: EM i Rem jednostki są praktyczne w tworzeniu całkowicie skalowalne układ!
* Rzutni = rozmiaru okna przeglądarki. Jeśli rzutnia ma 50cm szerokości, 1vw = 0,5 cm.
absolutna Długości
Bezwzględne jednostki długości są stałe i długość wyrażona w żadnym z nich pojawi się w dokładnie tej wielkości.
Bezwzględne jednostki długości nie są zalecane do stosowania na ekranie, ponieważ rozmiary ekranu różnią się tak bardzo. Jednakże, mogą być stosowane, jeżeli średni wyjście jest znany, na przykład do układu drukowania.
Jednostka | Opis |
---|---|
cm | centymetrów Wypróbuj |
mm | milimetrów Wypróbuj |
in | calach (1in = 96px = 2.54cm) Wypróbuj |
px * | pikseli (1px = 1/96th of 1in) Wypróbuj |
pt | Punkty (1pt = 1/72 of 1in) Wypróbuj |
pc | pica (1pc = 12 pt) Wypróbuj |
* Pikseli (px) są w stosunku do urządzenia widzenia. W przypadku urządzeń o niskich dpi, 1px to jeden piksel Urządzenie (dot) na wyświetlaczu. W przypadku drukarek i wysokiej rozdzielczości ekranów urządzeń 1px implikuje wiele pikseli.