Websiteentwicklung: CSS: Schriftstil


Mit der Eigenschaft font-style kann die Schrift bei visueller Präsentation besonders hervorgehoben werden. Während bei 'normaler' Schrift markante Züge von Glyphen oft horizontal und vertikal ausgerichtet sind, etwa bei Glyphen wie H, L, F, kann durch den font-style auch eine Verkippung und Scherung der Glyphen erreicht werden. Dabei ist zu unterscheiden zwischen Schriften, die rein rechnerisch durch eine Scherung einer normalen Schrift realisiert werden und solchen, wo der visuelle Effekt der Verkippung durch eine ähnliche Schrift erreicht wird, die aber komplett neu erstellt wird. Bei letzterer kann auch die Verwendung von Ligaturen anders sein, jedenfalls sind die Glyphen nicht durch eine einfache affine Transformation aus der normalen Schrift zu erhalten. Letzterer Typ wird kursiv (englisch italic genannt, ersterer oblique.

Üblicherweise findet die Verkippung in Leserichtung statt, also bei oblique in Form einer Scherung, bei der der Teil des Glyphen oberhalb der Grundlinie abhängig von der jeweiligen Höhe des Fragments nach rechts verschoben wird, je höher, desto mehr verschoben. Unterhalb der Grundlinie wir dann entsprechend mit weiterem Abstand von der Grundlinie mehr nach links verschoben. In Ausnahmefällen gibt es auch eine umgedrehte Richtung sein, also ein Verkippen oben nach links.

font-style hat die Schlüsselwörter 'normal' für eine normale, aufrechte Schrift, 'italic' für kursive Schrift und 'oblique' für eine oblique Schrift und 'inherit'. Ist keine echte kursive Schrift verfügbar, kommt ersatzweise auch eine oblique zum Einsatz.

Der Initialwert ist 'normal'. Die Eigenschaft wird vererbt und ist anwendbar auf alle Elemente bei visuellen Medien.

Beispiel:

p {
  font-style: italic;
}

Normaler Text, kursiver Text und obliquer Text.