CSS font-variant für Kapitälchen

Schriftvariante: Kapitälchen oder nicht?

Eine selten verwendete Funktion im Rahmen von CSS ist jene der Schriftvariante. Es gibt hier die Auswahl zwischen zwei Optionen, nämlich der normalen Grundeinstellung und jener von small-caps, wodurch der eingeschlossene Text mittels Kapitälchen dargestellt wird.

Wählt man diese Option, dann zeigt sich die Schrift schon deutlich verändert und in einer Liste würde ein so geschriebener Text ganz sicher auffallen, aber so wirklich bewusst ist die Möglichkeit oft nicht und dann gibt es auch das Problem, dass man nicht zu viele Textformatierungen vornehmen sollte, weil sonst wird es auch für das Auge zuviel. Vielleicht ist das auch der Grund, warum man die Kapitälchen eher meidet.

Kapitälchen mit CSS und font-variant

In CSS erfolgt die Vorgabe des Schriftvariante folgendermaßen:

font-variant: normal;
font-variant: small-caps;

Mit der ersten Einstellung braucht man sich nicht abgeben, wenn die Variante nicht geändert wird. Anders ist der Fall, wenn man auf small-caps umgeschaltet hat - dann ist die Normal-Einstellung durchaus relevant, weil man damit zur Grundeinstellung zurückkehren kann. Andernfalls werden die ausgewählten Textstellen weiter mit Kapitälchen dargestellt.

ergibt:

font-variant: small-caps

font-variant: normal;

Lesen Sie auch

Die Textformatierung ist bei CSS neben der Positionierung eine Hauptaufgabe, weil gefälliger Text einfach eher angenommen wird und einen Mehrwert darstellt. Man darf es nicht übertreiben, aber man kann sich damit sich auch einmal spielen und ein wenig die Reaktionen überprüfen. Wichtig ist einmal die grundsätzliche Einstellung der Schriftart und Schriftgröße.

Dann kommen Befehle, die sehr häufig benötigt werden. Dazu gehört font-weight für die Fettschrift, alternativ und nicht so häufig wird man font-style für kursiv nutzen. Sehr oft braucht man color für die Textfarbe und text-decoration speziell bei der Gestaltung und Auszeichnung der Links.

Und dann gibt es noch weitere Einstellungen wie den Abstand von Buchstaben und Wörter, den Schatten oder auch die Textumwandlung und die Schriftvariante.

Diesen Artikel teilen

Kategorien

Grundlagen
HTML-Grundlagen
CSS-Grundlagen
Javascript-Grundlagen
PHP-Grundlagen
MySQL-Grundlagen
SEO-Grundlagen

Infos, Tipps, Vermarktung
Webdesign-Lexikon
Online-Werbung
PHP-Codeschnipsel