Uvod u CSS

Duljine


Kod mjernih jedinica i vrijednosti za duljine situacija nije ništa manje složena nego kod boja. Postoji nekoliko različitih načina označavanja vrijednosti koji se ravnopravno koriste. Pogledajmo neke najčešće korištene mjerne jedinice za duljine.

  • Jedinice za izražavanje duljine dužina odnose se i na vodoravne i na uspravne dužine. Primjerice, istim se jedinicama mjeri visina znakova i širina tablice.

point [pt] – tipografska jedinica koja dužinu od jednog inča definira sa 72pt. Duljina jednog inča je 2,54 cm pa uz malo računanja za veliko slovo standardnog fonta od 12pt, koji je uglavnom unaprijed zadan kod većine programa za obradu teksta, dobijemo vrijednost od 0,42 cm.

em [em] – relativna jedinica za definiranje veličine fonta. Po definiciji je ekvivalentna vrijednosti font-size za dani element. Primjerice, ukoliko za paragraf definiramo vrijednost font-size od 12pt, tada će unutar tog paragrafa 1em poprimiti vrijednost od 12pt, 2em vrijednost od 24pt itd.

piksel [px] – približite li dovoljno pogled vašem zaslonu, primijetit ćete da je podijeljen u rešetkastu strukturu sastavljenu od malih kvadratića. Ti se kvadratići nazivaju pikseli. Jedna od najvažnijih stvari koje povezujemo s pikselima je rezolucija koju koristimo na monitoru. Danas su u upotrebi monitori različitih veličina i oblika („obični” i široki, wide), ali možemo smatrati da je širina većine monitora između 1000 i 1600 piksela. Neke od poznatih rezolucija su 1280x1024, 1280x768, 1600x1200 i mnoge druge.

Koje mjerne jedinice treba upotrebljavati, ovisi o namjeni. Za web stranice predviđene isključivo prikazu na zaslonu dobro je koristiti piksel jer će njegova vrijednost uglavnom biti definirana stvarnom fizičkom veličinom piksela zaslona, dok je za web stranice namijenjene ispisu bolje koristiti point ili em koji su toj namjeni više prilagođeni.

  • Provjerite rezolucije monitora na svim uređajima s kojih pristupate webu.
  • Rezoluciju koju ste pronašli možete usporediti s rezultatom koji se ispisuje na web-stranici koja provjerava rezoluciju vašeg ekrana.




Accessibility

Boja pozadine

Font

Veličina fonta

1

Boja teksta