Stil mit {stil}

Jan 2009

Font – CSS für Schriften

CSS bietet ein ähnliches Spektrum von Eigenschaften für Gestaltung von Webseiten mit Schriften wie ein professionelles Textverarbeitungsprogramm. Hierzu gehören Schriftarten, -größen, -stile und -varianten wie Kapitälchen oder Versalien, die Spationierung und der Leerraum zwischen Wörtern.

CSS definiert die folgenden Eigenschaften für die Formatierung von Schriften:

• [ font ]
• font-family Schriftfamilie oder Schriftart
• font-size Schriftgröße
• font-style kursive Schrift
• font-variant Kapitälchen
• font-weight fette Schrift

Die CSS-Eigenschaft font ist eine Kurzschrift, die Schriftfamilie, Schriftgröße und Varianten der Schrift in eine CSS-Regel setzt:

p { font: italic small-caps bold 1.2em/1.5em Georgia,'Times New Roman', serif; } 
            ^         ^       ^    ^     ^      ^              ^          ^
            |         |       |    |     |      |              |          |
            |         |       |    |     |      |              |          +- Schriftfamilie
            |         |       |    |     |      |              |
            |         |       |    |     |      |              +- Alternativschrift  
            |         |       |    |     |      |          
            |         |       |    |     |      +- Wunschschrift
            |         |       |    |     |
            |         |       |    |     +- Zeilenabstand (line-height)
            |         |       |    |
            |         |       |    +- Schriftgröße
            |         |       |
            |         |       +- Schriftgewicht
            |         |
            |         +- Schriftvariante Kapitälchen
            |
            +- Schriftstil kursiv      

Der Schrägstrich vor /line-height muss gesetzt werden und trennt die Schriftgröße von der Zeilenhöhe (line-height).

Stile für die Gestaltung von Texten bietet die Gruppe der CSS-Eigenschaften »text«:

• letter-spacing für gesperrte und gestauchte Schrift
• text-indent Einzug bei Absätzen
• text-transform Alle Zeichen in Großbuchstaben (Versalien) oder Kleinbuchstaben

font

IE4+ M1 N4+ O5+ S1 CSS1/Erweitert in CSS2 Erblich: Ja

font

ist eine Kurzschrift und bestimmt in einer Deklaration alle sechs Eigenschaften der zu verwendenden Schrift.

Werte

[ [ <'font-style'> || <'font-variant'> || <'font-weight'> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'> ] | caption | icon | menu | message-box | small-caption | status-bar | inherit

Zusätzlich kann font seit CSS2 Systemschriften ansprechen – wobei die Systemschriften tatsächlich nur durch die font-Eigenschaft deklariert werden können, nicht aber durch font-family.

caption

Schrift in Schaltflächen.

icon

Schrift der Symbole (icons).

menu

Schrift der Klappmenüs.

message-box

Schrift der Dialogfenster.

small-caption

Schrift kleiner Schaltflächen.

status-bar

Schrift der Windows-Statusleiste.

zurück zum Seitenanfang