font-feature-settings

Baseline 2025

Newly available

Since ⁨September 2025⁩, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Der font-feature-settings CSS Deskriptor erlaubt es, die initialen Einstellungen für die Schriftart festzulegen, die durch die @font-face-Regel definiert wird. Sie können diesen Deskriptor weiter verwenden, um typografische Schrifteigenschaften wie Ligaturen, Kapitälchen und Schwünge für die durch @font-face definierte Schriftart zu steuern. Die Werte für diesen Deskriptor sind dieselben wie für die font-feature-settings-Eigenschaft, mit Ausnahme der globalen Schlüsselwortwerte.

Da dieser Deskriptor Werte für Merkmale auf dem Schriftobjekt in der @font-face-Regel und nicht auf einem gesamten Element setzt, können nur einige Glyphen in einem Element unter Verwendung dieses Deskriptors gerendert werden.

Syntax

css

/* Use the default settings */
font-feature-settings: normal;

/* Set values for OpenType feature tags */
font-feature-settings: "smcp";
font-feature-settings: "smcp" on;
font-feature-settings: "swsh" 2;

Werte

Dieser Deskriptor wird entweder als Schlüsselwort normal oder als kommagetrennte Liste von <feature-tag-value>-Werten angegeben. Beim Rendern von Text wird die Liste von OpenType-<feature-tag-value>-Werten an die Textlayout-Engine übergeben, um Schrifteigenschaften zu aktivieren oder zu deaktivieren.

normal

Gibt an, dass der Text anhand der Standardeinstellungen der Schriftart ausgelegt wird. Dies ist der Standardwert.

<feature-tag-value>

Stellt ein durch Leerzeichen getrenntes Paar bestehend aus einem Tag-Namen und einem optionalen Wert dar.

Der Tag-Name ist immer ein <string> aus vier ASCII-Zeichen. Wenn der Tag-Name mehr oder weniger Zeichen enthält oder Zeichen außerhalb des U+20 – U+7E Code-Punkt-Bereichs enthält, ist der Deskriptor ungültig.

Der optionale Wert kann eine positive ganze Zahl oder das Schlüsselwort on oder off sein. Die Schlüsselwörter on und off sind Synonyme für die Werte 1 und 0. Wenn kein Wert festgelegt ist, ist der Standardwert 1. Für nicht-boolesche OpenType-Funktionen (z.B. stylistic alternates) impliziert der Wert die Auswahl eines bestimmten Glyphen. Für boolesche Funktionen aktiviert oder deaktiviert der Wert die Funktion.

Formale Definition

Anfangswert	`normal`
Anwendbar auf	all elements and text. Auch anwendbar auf `::first-letter` und `::first-line`.
Vererbt	Ja
Berechneter Wert	wie angegeben
Animationstyp	diskret

Formale Syntax

font-feature-settings = 
  normal                |
  <feature-tag-value>#

Beispiele

Aktivierung von Schwung-Glyphen mithilfe der @font-face Regel

In diesem Beispiel werden der Tag-Name swsh und ein boolescher Wert 1 als Wert für den font-feature-settings-Deskriptor in der @font-face-Regel verwendet.

HTML

html

<p class="swash-off">Swash is off here</p>
<p class="swash-on">Swash is on here</p>

CSS

css

@font-face {
  font-family: "MonteCarlo";
  src: url("/https/developer.mozilla.org/shared-assets/fonts/monte-carlo/monte-carlo-regular.woff2");
}
@font-face {
  font-family: "MonteCarlo2";
  src: url("/https/developer.mozilla.org/shared-assets/fonts/monte-carlo/monte-carlo-regular.woff2");
  font-feature-settings: "swsh" 1;
}
p {
  font-size: 3rem;
  margin: 0.7rem 3rem;
}
.swash-off {
  font-family: "MonteCarlo", cursive;
}
.swash-on {
  font-family: "MonteCarlo2", cursive;
}

Ergebnis

Zeile 1 zeigt das standardmäßige, verzierte Design der MonteCarlo Schriftart, und Zeile 2 zeigt die Standardglyphen, die durch Schwung-Glyphe ersetzt werden.

Spezifikationen

Specification
CSS Fonts Module Level 4 # font-rend-desc

Browser-Kompatibilität

Siehe auch

Andere @font-face Deskriptoren: font-family, font-style, font-variation-settings, font-weight, src
Verwandte Schrifteigenschaften: font-feature-settings, font-variant-alternates, font-variation-settings

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden