CSS-Schriften
Das CSS-Schriften-Modul definiert schriftbezogene Eigenschaften und wie Schriftressourcen geladen werden. Es ermöglicht Ihnen, den Stil einer Schrift zu definieren, wie z.B. ihre Familie, Größe und Gewicht, sowie die Glyphenvarianten, die verwendet werden sollen, wenn mehrere für ein einzelnes Zeichen verfügbar sind.
Eine Schrift ist eine Ressourcendatei, die die visuelle Darstellung von Zeichen enthält und Zeichenkodierungen auf Glyphen abbildet, die Buchstaben, Zahlen, Satzzeichen und sogar Emojis einer Schriftart repräsentieren. Eine Schriftfamilie ist eine Gruppe von Schriften, die gemeinsame Designstile und Schrifteigenschaften teilen, wobei jedes Mitglied der Gruppe unterschiedliche Möglichkeiten zur Anzeige der Glyphen bietet, variierend in Strichstärke, Neigung oder relativer Breite, unter anderen Attributen. Eine Schrift repräsentiert in der Regel einen einzelnen Stil einer Schriftart, wie Helvetica, das fett und kursiv ist. Eine Schriftfamilie ist das vollständige Set von Stilen. Das Einbinden einer solchen Schrift in ein Dokument oder Design erfolgt durch die Definition einer separaten @font-face
-Deklaration für jede Schriftressource.
Die Eigenschaften, At-Regeln und Deskriptoren des CSS-Schriftenmoduls ermöglichen das Herunterladen mehrerer Variationen einer Schrift. Sie definieren auch die zu verwendende Schriftdatei für ein bestimmtes Schriftsmerkmal, zusammen mit Fallback-Anweisungen für den Fall, dass eine Ressource nicht geladen werden kann. Der CSS-Schriftauswahlmechanismus beschreibt den Prozess des Abgleichs eines gegebenen Satzes von CSS-Schrifteigenschaften mit einem einzelnen Schriftstil.
Das CSS-Schriftenmodul unterstützt auch variable Schriften. Anders als reguläre Schriften, bei denen jeder Stil als separate Schriftdatei implementiert wird, können variable Schriften alle Stile innerhalb einer einzigen Datei enthalten. Durch die Verwendung einer einzigen @font-face
-Deklaration können Sie eine variable Schrift importieren, die alle Stile umfasst. Abhängig von der Schrift kann dies eine Vielzahl von Schriftvarianten beinhalten. Variable Schriften sind Teil der OpenType-Schriftenspezifikation.
Referenz
Eigenschaften
-
font
Kurzform font-family
font-feature-settings
font-kerning
font-language-override
font-optical-sizing
font-palette
font-size
font-size-adjust
font-stretch
font-style
font-weight
-
font-synthesis
Kurzform font-synthesis-position
font-synthesis-small-caps
font-synthesis-style
font-synthesis-weight
-
font-variant
Kurzform font-variant-alternates
font-variant-caps
font-variant-east-asian
font-variant-emoji
font-variant-ligatures
font-variant-numeric
font-variant-position
font-variation-settings
Die Spezifikation definiert auch die font-width
Eigenschaft, die von keinem Browser derzeit unterstützt wird.
At-Regeln und Deskriptoren
- At-Regel:
@font-face
-
Deskriptoren:
Das CSS-Schriftenmodul definiert auch die Deskriptoren font-language-override
, font-named-instance
, font-width
, font-size
, subscript-position-override
, subscript-size-override
, superscript-position-override
und superscript-size-override
. Derzeit unterstützt kein Browser diese Features.
- At-Regel:
@font-feature-values
Das CSS-Schriftenmodul definiert auch den Deskriptor font-display
. Derzeit unterstützt kein Browser dieses Feature.
- At-Regel:
@font-palette-values
-
Deskriptoren:
Datentypen
font-size
Typen:
font-family
Typ:
font-feature-settings
Typ:
font-format
Typ:
font-stretch
Typ:
font-tech
Typen:
font-variant
Typen:
font-variant-ligatures
Typen:
font-variant-numeric
Typen:
font-weight
Typ:
Schnittstellen
Leitfäden
- Lernen: Grundlegende Text- und Schriftstile
-
Dieser Anfängerleitfaden behandelt die grundlegenden Prinzipien der Text- und Schriftstile. Er behandelt, wie man die Schriftstärke, -familie und -stil durch Verwendung der
font
Kurzform setzt und wie man Text ausrichtet sowie den Linien- und Buchstabenabstand verwaltet. - Lernen: Web-Schriften
-
Dieser Anfängerleitfaden erklärt, wie man benutzerdefinierte Schriften auf Ihrer Webseite verwendet, um vielfältigere und benutzerdefinierte Textstile zu ermöglichen.
- OpenType-Schriftfeatures
-
Schriftfeatures oder Varianten beziehen sich auf verschiedene Glyphen oder Zeichenstile innerhalb einer OpenType-Schrift. Dazu gehören Dinge wie Ligaturen (spezielle Glyphen, die Zeichen kombinieren wie 'fi' oder 'ffl'), Kerning (Anpassungen des Abstands zwischen spezifischen Buchstabenpaaren), Brüche, Zahlenstile und viele weitere. Diese werden alle als OpenType-Features bezeichnet und sind im Web über spezifische Eigenschaften und eine low-level Kontroll-Eigenschaft —
font-feature-settings
— verfügbar. Dieser Artikel bietet Ihnen alles, was Sie über die Verwendung von OpenType-Schriftfeatures in CSS wissen müssen. - Variable Schriften
-
Dieser Artikel hilft Ihnen beim Einstieg in die Verwendung von variablen Schriften.
- Verbesserung der Schriftenleistung
-
Dieser Artikel, Teil des CSS-Leistungsleitfadens, behandelt das Laden von Schriften, das Laden nur der erforderlichen Glyphen und das Definieren des Schriftdarstellungsverhaltens mit dem
font-display
Deskriptor.
Verwandte Konzepte
letter-spacing
CSS-Eigenschaftline-height
CSS-Eigenschafttext-transform
CSS-Eigenschaft
Spezifikationen
Specification |
---|
CSS Fonts Module Level 4 |
Siehe auch
- CSS Schriftlade Modul
- CSS Schriftlade-API
- CSS Text Modul
- CSS Schreibmodi Modul