Back to Content

CSSFontFaceRule

files/en-us/web/api/cssfontfacerule/index.md

latest1.1 KB
Original Source

{{APIRef("CSSOM")}}

The CSSFontFaceRule interface represents an {{cssxref("@font-face")}} at-rule.

{{InheritanceDiagram}}

Instance properties

Inherits properties from its ancestor {{domxref("CSSRule")}}.

  • {{domxref("CSSFontFaceRule.style")}} {{ReadOnlyInline}}
    • : Returns a {{domxref("CSSFontFaceDescriptors")}} object that allows reading and setting the descriptors of the associated {{cssxref("@font-face")}} at-rule.

Instance methods

Inherits methods from its ancestor {{domxref("CSSRule")}}.

Examples

This example uses the CSS found as an example on the {{cssxref("@font-face")}} page. The first {{domxref("CSSRule")}} returned will be a CSSFontFaceRule.

css
@font-face {
  font-family: "MyHelvetica";
  src:
    local("Helvetica Neue Bold"), local("HelveticaNeue-Bold"),
    url("MgOpenModernaBold.woff2");
  font-weight: bold;
}
js
const myRules = document.styleSheets[0].cssRules;
console.log(myRules[0]); // A CSSFontFaceRule

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}