CSS-Schriftarten (Font)

Weiter unten wird jede einzelne erläutert:

font-family

Die font-family-Eigenschaft gibt an, welche Schriftart benutzt werden wird.

CSS-Statement	Ausgabe
p {font-family: verdana;}	Schriftart Verdana.
p {font-family: arial;}	Schriftart Arial.
p {font-family: impact;}	Font Family Impact.

font-size

Die font-size-Eigenschaft gibt die Schriftartgröße an. Der Wert kann numerisch (Länge oder Prozentangabe) sein, oder ein Text (hier sind mögliche Werte „xx-large”, „x-large”, „large”, „medium”, „small”, „x-small“, und „xx-small“).

CSS-Statement	Ausgabe
p {font-size:9px;}	Schriftgröße 9px.
p {font-size:150%;}	Schriftgröße 150%.
p {font-size:0.8cm;}	Schriftgröße 0,8cm.
p {font-size:small;}	Schriftgröße klein.
p {font-size:large;}	Schriftgröße groß.

font-weight

Die font-weight-Eigenschaft gibt an, welche Schriftdicke benutzt werden wird. Die Werte für Schriftdicke können von 100 bis 900 reichen, wobei 900 am dicksten ist. Man kann auch „bold”, „bolder”, oder „normal” angeben.

Beispiele:

CSS-Statement	Ausgabe
p {font-weight: 100;}	Dies ist Schriftdicke 100.
p {font-weight: 900;}	Dies ist Schriftdicke 900.
p {font-weight: bold;}	Dies ist Schriftdicke bold.

font-style

Die font-style-Eigenschaft bestimmt ob die Schriftart kursiv oder schräg dargestellt werden soll.

CSS-Statement	Ausgabe
p {font-style: italic;}	Dies ist kursive Schrift.

font-variant

Die font-variant Eigenschaft bestimmt, ob die Schrift in Kapitälchen angezeigt werden wird. Kapitälchen sind großgeschriebene Buchstaben, die aber eine kleinere Schriftgröße haben. Mögliche Werte sind „small-caps” und „normal”. Schauen wir uns ein Beispiel hierzu an.

Mit dem folgenden CSS-Statement:

span {   font-variant:small-caps; }

würde der folgende HTML-Code:

<span>erst in Kapitälchen</span> UND DANN IN GROßBUCHSTABEN.

so aussehen:

erst in Kapitälchen UND DANN IN GROßBUCHSTABEN.