CSSFontFeatureValuesRule: fontFamily-Eigenschaft

Baseline 2023

Newly available

Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Die fontFamily-Eigenschaft der CSSConditionRule-Schnittstelle repräsentiert den Namen der Schriftfamilie, auf die sie angewendet wird.

Wert

Ein String.

Beispiele

Schriftfamilie auslesen

In diesem Beispiel deklarieren wir zwei @font-feature-values, eine für die Schriftfamilie Font One und die andere für Font Two. Dann verwenden wir das CSSOM, um diese Schriftfamilien auszulesen und sie im Log anzuzeigen.

html
<pre id="log"></pre>

CSS

css
/* At-rule for "nice-style" in Font One */
@font-feature-values Font One {
  @styleset {
    nice-style: 12;
  }
}

/* At-rule for "nice-style" in Font Two */
@font-feature-values Font Two {
  @styleset {
    nice-style: 4;
  }
}

/* Apply the at-rules with a single declaration */
.nice-look {
  font-variant-alternates: styleset(nice-style);
}

JavaScript

js
const log = document.getElementById("log");
const rules = document.styleSheets[document.styleSheets.length - 1].cssRules;

const fontOne = rules[0]; // A CSSFontFeatureValuesRule
log.textContent = `The 1st '@font-feature-values' family: "${fontOne.fontFamily}".\n`;

const fontTwo = rules[1]; // Another CSSFontFeatureValuesRule
log.textContent += `The 2nd '@font-feature-values' family: "${fontTwo.fontFamily}".`;

Spezifikationen

Specification
CSS Fonts Module Level 4
# dom-cssfontfeaturevaluesrule-fontfamily

Browser-Kompatibilität

BCD tables only load in the browser