CSS-Schriften

Das CSS-Schriften-Modul definiert schriftenbezogene 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 zu verwenden, wenn mehrere für ein einzelnes Zeichen verfügbar sind.

Eine Schrift ist eine Ressourcendatei, die die visuelle Darstellung von Zeichen enthält und Zeichencodes auf Glyphen abbildet, die Buchstaben, Zahlen, Satzzeichen und sogar Emojis eines Schriftbildes darstellen. 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, die sich z. B. durch Strichstärke, Neigung oder relative Breite unterscheiden. Eine Schrift repräsentiert typischerweise einen einzelnen Stil eines Schriftbildes, wie zum Beispiel Helvetica, das fett und kursiv ist. Eine Schriftfamilie ist der vollständige Satz 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-Schriften-Moduls ermöglichen das Herunterladen von mehreren Variationen einer Schrift. Sie definieren auch die Schriftdatei, die für eine bestimmte Schrifteigenschaft verwendet werden soll, zusammen mit Fallback-Anweisungen für den Fall, dass eine Ressource nicht geladen werden kann. Der CSS-Schriftauswahlmechanismus beschreibt den Prozess der Zuordnung einer gegebenen Menge an CSS-Schrifteigenschaften zu einem einzelnen Schriftbild.

Das CSS-Schriften-Modul unterstützt auch variable Schriften. Im Gegensatz zu regulären Schriften, bei denen jeder Stil als separate Schriftdatei implementiert ist, können variable Schriften alle Stile in 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 umfassen. Variable Schriften sind Teil der OpenType-Schriftenspezifikation.

Referenz

Eigenschaften

At-Regeln und Deskriptoren

At-Regel: @font-face

Deskriptoren:

Die Spezifikation 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, die von keinem Browser unterstützt werden.

At-Regel: @font-feature-values

Deskriptor:

At-Regel: @font-palette-values

Deskriptoren:

Datentypen

Schnittstellen

Leitfäden

Lernen: Grundlegendes Text- und Schriftstyling

Dieser Anfängerleitfaden behandelt die grundlegenden Grundlagen des Text- und Schriftstylings. Er behandelt, wie man das Schriftgewicht, die Familie und den Stil mit der font-Kurzschreibweise setzt und wie man Text ausrichtet und den Zeilen- und Buchstabenabstand verwaltet.

Lernen: Web-Schriften

Dieser Anfängerleitfaden erklärt, wie man benutzerdefinierte Schriften auf Ihrer Webseite verwendet, um variierteres und benutzerdefiniertes Textstyling zu ermöglichen.

Leitfaden zu OpenType-Schriftenmerkmalen

Schriftmerkmale oder Varianten beziehen sich auf verschiedene Glyphen oder Zeichenstile, die in einer OpenType-Schrift enthalten sind. Dazu gehören Dinge wie Ligaturen (besondere Glyphen, die Zeichen wie 'fi' oder 'ffl' kombinieren), Kerning (Anpassungen des Abstands zwischen bestimmten Buchstabenpaaren), Brüche, Zahlenstile und viele andere. Dies sind alles OpenType-Merkmale, die durch spezifische Eigenschaften und eine Low-Level-Steuereigenschaft — font-feature-settings — im Web nutzbar sind. Dieser Artikel bietet Ihnen alles, was Sie über die Verwendung von OpenType-Schriftmerkmalen in CSS wissen müssen.

Leitfaden zu variablen Schriften

Dieser Artikel hilft Ihnen beim Einstieg in die Verwendung von variablen Schriften.

Verbesserung der Schriftperformance

Dieser Artikel, Teil des CSS-Performance-Leitfadens, behandelt das Laden von Schriften, das Laden nur der erforderlichen Glyphen und das Definieren des Schriftanzeigeverhaltens mit dem font-display-Deskriptor.

Verwandte Konzepte

Spezifikationen

Specification
CSS Fonts Module Level 4

Siehe auch