Webdesign mit CSS, HTML und Javascript
Stil mit {stil}
Fotokurse und Schulungen»Digitale Fotografie - Bildgestaltung« Noch nie war es so einfach, Fotografieren zu lernen |
Fotografie von ihrer besten Seite: Aktuelle Kameras, Bildbearbeitung und Fototipps auf foto.5lux.de |
Feb 2009
CSS-Eigenschaft font-variant – Kapitälchen für die Schriftauszeichnung

- Kapitälchen auf Webseiten werden aus »digitalen« Zeichen erzeugt – der Browser setzt den ersten Buchstaben größer und verkleinern die folgenden Buchstaben. Diese digitalen Kapitälchen verraten sich durch die dickere Strichstärke des ersten Buchstabens.
Kapitälchen setzen einen Text in reinen Großbuchstaben, erhalten aber die Größe der Kleinbuchstaben ungefähr in der x-Höhe des normalen Schnittes oder ein wenig größer. Diese Form der Schriftauszeichnung eignet sich besonders zur Hervorhebung von Eigennamen in Fließtexten. Kapitälchen wirken im Satzbild edler als fette oder kursive Schrift.
p { font-variant: small-caps; }
oder
<span style="font-variant: small-caps;">Kapitälchen</span>
Digitale Kapitälchen
Echte Kapitälchen (Trajan Pro) (auf lokalem Rechner)
Echte Kapitälchen (Trajan Pro) (eingebettet)
Nur sichtbar, wenn Trajan Pro auf dem Rechner installiert ist oder mit Firefox oder Safari (Browser, die CSS3 Eingebettete Schriften unterstützen)
font-variant
IE4+ M1 N6 O5+ S1 CSS1 Erblich: Ja
- font-variant
- stellt die Schrift in Kapitälchen dar.
- Werte
- normal | small-caps | inherit
- normal
- ist die Voreinstellung. Die Angabe von normal stellt sicher, dass keine vorangegangene Deklaration die Darstellung des Textes beeinflusst.
- small-caps
- stellt die Schrift in Kapitälchen dar.
Webseiten mit CSS gestalten
Element-, Klassen- und ID-Selektoren
background & color Farben
font Schriftgestaltung auf Webseiten
text-align • Ausrichten von Texten
- letter-spacing • Raum zwischen Zeichen
- text-decoration • Text unterstreichen
- text-indent • Text einrücken
- text-transform • Großschreibung / Versalien
- white-space • Zeilenumbruch in Texten
- word-spacing • Raum zwischen Wörtern
- vertical-align • Hochstellen / Tiefstellen
- direction | unicode-bidi • Laufrichtung von Texten
width height
margin • äußerer Abstand
list-style Listen und Aufzählungen
position Positionierung
table Tabellen
user interface Mauszeiger / cursor
visibility Sichtbarkeit
generated content • Autom. generierte Zähler
Kurzreferenz CSS 2.1-Eigenschaften
Fotokurse und Schulungen
