Jedinice dužine u stilskom jeziku CSS definiraju veličinu nekog svojstva, kao šo su na primjer širina margine, veličina fonta ili debljina crte.[1] [2]
Dužina je izražena brojem iza koga se bez razmaka navodi odgovarajuća oznaka jedinice, kao na primjer 0.5em, 10px, 20%... Ako broj nije cijel, piše se s decimalnom točkom umjesto zareza. Kod nekih elemenata broj može biti negativan. Ako je broj 0 (nula), oznaka jedinice se može izostaviti. Primjer:
margin: 2em 0 -1.5em 0;
Jedinice dužine mogu biti relativne i apsolutne, te su prema tome razvrstane u sljedeće tablice:
Relativne jedinice
Relativne jedinice definiraju dužinu u odnosu na veličinu nekog drugog svojstva. Ovaj se način rabi ako je potrebno skaliranje svojstva, odnosno njegovo prilagođenje za različito prikazivanje na raznim medijima.
Jedinica | Opis | Napomena |
---|---|---|
em | ralativna u odnosu na veličinu (visinu) fonta | 2em je 2 × veličina fonta |
ex | relativna u odnosu na visinu slova "x" u odgovarajućem fontu | |
ch | relativna u odnosu na širinu "0" (nule) | |
rem | relativna u odnosu na veličinu fonta vršnog svojstva | |
vw | relativna u odnosu na 1 % širine viewporta | 1vw je 1 % širine prosotra |
vh | relativna u odnosu na 1 % visine viewporta | 1vw je 1 % visine prosotra |
vmin | relativna u odnosu na 1 % manje dimenzije viewporta | |
vmax | relativna u odnosu na 1 % veće dimenzije viewporta | |
% | postotak odgovarajuće veličine |
- Podebljane su često rabljene jedinice
- Kod nasljednih elemenata, nasljednici preuzimaju rezultirajuću vrijednost, a ne relativnu vrijednost, kao u primjeru:
BODY { font-size: 12pt; text-indent: 3em; /* 3 × 12pt = 36pt */ } H1 { font-size: 15pt }
- odnosno, "text-indent" u "H1" naslijedit će vrijednost 36pt a ne 45pt.
Apsolutne jedinice
Apsolutne jedinice definiraju fiksnu veličinu svojstva.
Jedinica | Opis | Napomena |
---|---|---|
cm | centimetar | 1cm = 0.39in = 37.8px = 28.34pt = 2.36pc |
mm | milimetar | 1mm = 0.039in = 3.78px = 2.83pt = 0.24pc |
in | inč | 1in = 2,54 cm = 96px = 72pt = 6pc |
px | piksel | 1px = 1/96 dio inča = 0.26mm |
pt | točka | 1pt = 1/72 dio inča = 0.35mm |
pc | pika | 1pc = 1/6 inča = 12pt = 4.23mm |
- Jedinica piksel zamišljena je kao najmanja jedinica mjere digitalne slike (i najmanji element koji je moguće adresirati) i definirana je kao 96. dio inča (~0,26 mm), odnosno jedna točka na zaslonu kod uređaja niske rezolucije. Stoga je uvršten u tablicu apsolutih jedinica, iako je veličina piksela ovisna o mediju.[3][4]
Primjeri
Za primjere uporabe pogledajte stranicu pomoći.
Izvori
- ↑ CSS units na stranici www.w3schools.com (en.) (pristupljeno 25. veljače 2016.)
- ↑ Jedinice dužine u preporukama W3C-a, stranica Cascading Style Sheets, level 1, www.w3.org (en.) (pristupljeno 25. veljače 2016.)
- ↑ Apsolutne jedinice u preporukama W3C-a, stranica Syntax and basic data types, www.w3.org (en.) (pristupljeno 25. veljače 2016.)
- ↑ Jedinice u tipografijii i digitalnim slikama s pretvorbom jedinica, www.translatorscafe.com (en.) (pristupljeno 16. ožujka 2016.)