Font Styles

1. Font style

Was macht font-style?

Mit der CSS-Eigenschaft font-style kann man einstellen, wie der Text optisch dargestellt wird – zum Beispiel kursiv. Sie wird häufig verwendet, um Wörter hervorzuheben, Überschriften stilvoller aussehen zu lassen oder um wichtige Stellen im Text sichtbarer zu machen.

Mögliche Werte von font-style

1. font-style: normal;

Das ist die normale Schrift ohne besondere Hervorhebung.

p {
    font-style: normal;
}

2. font-style: italic;

Das Wort italic macht den Text „kursiv“. Das ist die bekannteste Anwendung von font-style.

p {
    font-style: italic;
}

3. font-style: oblique;

oblique bedeutet ebenfalls schräger Text, aber technisch etwas anders: Der Browser kippt die normale Schrift künstlich nach rechts.

p {
    font-style: oblique;
}

Wann verwendet man font-style?

• um Text hervorzuheben (z. B. wichtige Begriffe)
• für Zitate oder Definitionen
• für Überschriften oder stilistische Effekte
• bei Textteilen, die ruhiger wirken sollen

Zusammenfassung

font-style hat nur 3 Werte, ist aber im Webdesign sehr wichtig:

• normal – Standard
• italic – echte kursive Schrift
• oblique – künstlich schräger Text

Besonders italic wird sehr oft benutzt, um Texte leichter lesbar und strukturierter zu machen.

2. Font Weight

Der CSS-Befehl font-weight steuert, wie dick oder fett eine Schrift ist. Damit kann man Überschriften betonen oder Texte lesbarer machen.

3. Font Variant

Mit font-variant kann man festlegen, wie bestimmte Buchstaben dargestellt werden. Am bekanntesten ist die Variante small-caps, bei der Kleinbuchstaben wie kleine Großbuchstaben aussehen.