Wartości i jednostki CSS

Oprócz znajomości selektorów CSS oraz właściwości CSS musimy zapoznać się również z wartościami jakimi możemy posługiwać się w języku CSS.

Przykładowo, dla właściwości text-align mamy z góry ustalone wartości, jakie możemy wybrać:

  • left - użyta wraz z właściwością text-align wyrówna tekst do lewego marginesu elementu.
  • right - użyta wraz z właściwością text-align wyrówna tekst do prawego marginesu elementu.
  • center - użyta wraz z właściwością text-align wyśrodkuje tekst w elemencie.
  • justify - użyta wraz z właściwością text-align wyrówna tekst do obu marginesów elementu (lewego i prawego).

Niektóre właściwości CSS oczekują od nas podania większej liczby wartości. Zazwyczaj każdą taką wartość należy oddzielić od drugiej spacją. Na przykład dla właściwości border można podać trzy wartości, oddzielone od siebie spacją, czyli 1px solid black.

Wyjaśnienie zapisu: 1px solid black

  • solid - dla właściwości border oznacza styl obramowania, oprócz niej mamy do wyboru dziewięć innych wartości (double, dotted, dashed, groove, ridge, inset, outset, hidden, none).
  • black - dla właściwości border oznacza kolor obramowania, oprócz niej mamy do wyboru bardzo dużą liczbę różnych kolorów, którymi zajmiemy się w następnej części tego kursu CSS.
  • 1px - dla właściwości border oznacza wartość szerokości obramowania, po prostu należy podać liczbę wraz z wybraną przez nas jednostką CSS, dlatego przyszedł czas na omówienie dostępnych jednostek CSS.

W realnym świecie mamy do dyspozycji różne jednostki i wielkości, np. jednostki długości: milimetry, centymetry, metry i tym podobne., które pozwalają nam dokładniej opisać przedmioty oraz zjawiska.

W języku CSS podobnie jak w realnym świecie mamy dostęp do jednostek, które pozwalają nam zdefiniować różne wartości, różnych właściwości CSS.

Dostępne wartości CSS zostały opisane w części przeznaczonej na szczegółowy opis wartości CSS, natomiast dostępne jednostki CSS zostały opisane w części przeznaczonej na szczegółowy opis jednostek CSS.