Własności czcionek

UWAGA: sekcja opisuje jedynie częściej używane własności czcionek. O zaawansowanych regułach @font-face możesz przeczytać w specyfikacji W3C CSS2, w części poświęconej czcionkom.

font

Wartość	[ `font-style` \|\| `font-variant` \|\| `font-weight` ] `font-size` [ `/ line-height` ] `font-family` \| `caption` \| `icon` \| `menu` \| `message-box` \| `small-caption` \| `status-bar` \| `inherit`
Używany z	wszystkie elementy
Dziedziczenie	tak
Przykład	`P { font: 12pt/14pt sans-serif }`

caption, icon, menu, message-box, small-caption, status-bar odnoszą się do czcionek użytych w odpowiednich elementach w ramach przeglądarki.

Inne typy wartości są pokazane w indywidualnych własnościach poniżej.

font-family

Wartość	lista wartości rozdzielonych przecinkami w kolejności ważności, zawierająca albo nazwę rodziny czcionek, albo nazwę rodzajową \| `inherit`
Używany z	wszystkie elementy
Dziedziczenie	tak
Przykład	`BODY { font-family: "Times New Roman", serif }`

Nazwy czcionek zawierające spacje muszą być ujęte w cudzysłów lub apostrofy, gdyż w przeciwnym razie zostanie użyty pierwszy wyraz takiej nazwy
Wartości mogą mieć jeden z dwóch typów:
- family-name : nazwa czcionki, taka jak Times New Roman.
- generic-family : jedna z wartości serif, sans-serif, cursive, fantasy, monospace. Jedna z nich powinna być wskazana jako ostateczna alternatywa.

font-style

Wartość	`normal` \| `italic` \| `oblique` \| `inherit`
Wartość początkowa	`normal`
Używany z	wszystkie elementy
Dziedziczenie	tak
Przykład	`BODY { font-style: italic }`

font-variant

Wartość	`normal` \| `small-caps` \| `inherit`
Wartość początkowa	`normal`
Używany z	wszystkie elementy
Dziedziczenie	tak
Przykład	`BODY { font-variant: small-caps }`

font-weight

Wartość	`normal` \| `bold` \| `bolder` \| `lighter` \| `100` \| `200` \| `300` \| `400` \| `500` \| `600` \| `700` \| `800` \| `900` \| `inherit`
Wartość początkowa	`normal`
Używany z	wszystkie elementy
Dziedziczenie	tak
Przykład	`BODY { font-weight: 900 }`

Normal i 400 są tym samym, podobnie jak bold i 700. Bolder i lighter są wartościami relatywnymi w stosunku do wartości dziedziczonej.

font-size

Wartość	`absolute-size` \| `relative-size` \| `length` \| `percentage` \| `inherit`
Wartość początkowa	`medium`
Używany z	wszystkie elementy
Dziedziczenie	tak
Wartości procentowe	relatywne w stosunku do wielkości czcionki elementu nadrzędnego

absolute-size to jedno z xx-small, x-small, small, medium, large, x-large, lub xx-large.

relative-size to larger lub smaller i representuje absolute-size, w stosunku do wartości dziedziczonej

length jest wartością dodatnią o jednostce em, ex lub pt. Wartości są względne wobec wartości dziedziczonej, ale w innych własnościach odnoszą się do wielkości czcionki bieżącego elementu.

Przykłady:

  P { font-size: 12pt; }
  P { font-size: larger }
  P { font-size: 150% }
  P { font-size: 1.5em }

font-size-adjust

Wartość	`number` \| `none` \| `inherit`
Wartość początkowa	`none`
Używany z	wszystkie elementy
Dziedziczenie	tak
Wartości procentowe	względne wobec wielkości czcionki elementu nadrzędnego

Własność jest używana do określenia położenia czcionki, aby zachować proporcję x-height pierwszej czcionki z listy, jeśli nie jest dostępna. Wartość określa kształt pierwszej czcionki.

font-stretch

Wartość	`normal` \| `wider` \| `narrower` \| `ultra-condensed` \| `extra-condensed` \| `condensed` \| `semi-condensed` \| `ultra-condensed` \| `semi-expanded` \| `expanded` \| `extra-expanded` \| `ultra-expanded` \| `inherit`
Wartość początkowa	normal
Używany z	wszystkie elementy
Dziedziczenie	tak
Przykład	`H1 { font-stretch: semi-condensed }`

Określa relatywną lub absolutną wartość dla szerokości czcionki. Wartości są tutaj uszeregowane od najwęższej do najszerszej.