CSS-Eigenschaft font-variant

Die Eigenschaft font-variant stellt den Text als normal oder Kapitälchen aus einer Schriftfamilie ein.

Die Eigenschaft font-variant wird durch zwei Werte angezeigt: normal und small-caps. Normal ist der Standardwert. Wenn wir Kapitälchen für einen Text auswählen, werden die Kleinbuchstaben zu den Großbuchstaben gemacht, aber diese konvertierten Buchstaben werden etwas kleiner als normale Großbuchstaben angezeigt.

Diese Eigenschaft wurde in CSS3 erweitert.

Anfangswert	normal
Gilt für	Alle Elemente. Es gilt auch für ::first-letter und ::first-line.
Geerbt	Ja
Animierbar	Nein
Version	CSS1
DOM Syntax	object.style.fontVariant = "normal";

Syntax

font-variant: normal | small-caps | initial | inherit;

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      .smallcaps {
      font-variant: small-caps;
      }
    </style>
  </head>
  <body>
    <h2>Ein Beispiel für die Eigenschaft Font-variant</h2>
    <p>Hier haben wir einen normalen Text verwendet, wie Sie sehen können.</p>
    <p class="smallcaps">Aber wir haben hier einen Text mit Kapitälchen verwendet.</p>
  </body>
</html>

Versuch es selber!

Werte

Wert	Beschreibung
normal	Bedeutet, dass Textzeichen normal sind. Das ist der Standardwert dieser Eigenschaft.
small-cups	Der Browser zeigt eine Schriftart mit Kapitälchen an.
initial	Es stellt die Eigenschaft auf seinen Standardwert ein.
inherit	Erbt die Eigenschaft von ihrem übergeordneten Element.