@font-face support in Firefox

From Webfonts.info

Jump to: navigation, search

Webfont support in Firefox 3.1 and higher

font-family

@font-face {
   font-family: GraublauWeb;
  }
@font-face {
   font-family: "Graublau Web";
  }


src

Firefox supports TrueType fonts (.ttf) as well as OpenType fonts with TrueType (.ttf) or PostScript (.otf) outlines.

Same-origin rule: By default, Firefox will only accept relative links. If you want to use absolute links or include fonts from different domains, you need to send these fonts with Access Control Headers.

@font-face {
   font-family: GraublauWeb;
   src: url("GraublauWeb.ttf") format("truetype");
}


You can make this a comma-separated list. You can also add locally-installed fonts. In this example, the webfont will only be downloaded if "Lucida Grande" can't be found on the client's system.

@font-face {
   font-family: GraublauWeb;
   src: local("Lucida Grande"), url("fonts/GraublauWeb.otf") format("opentype");
}


font-style

Defines the font style. Only one value ("all", "normal", "italic", "oblique") is allowed.

@font-face {
   font-family: "Graublau Web";
   src: url("GraublauWebItalic.ttf") format("truetype");
   font-style: oblique;
}


font-variant

Defines if the webfont uses Small Caps ("small-caps") or standard ("normal") glyphs.

font-variant: small-caps;



font-weight

Defines the font weight. Possible values: all, normal, bold, 100, 200, 300, 400, 500, 600, 700, 800, 900

Relative values (bolder, lighter) are not permitted.

"normal" will be used for the range 100-500, "bold" for the range 600-900

@font-face {
   font-family: "Graublau Web";
   src: url("GraublauWebBold.ttf") format("truetype");
   font-weight: bold;
}

Comma-separated values (e.g. 400,500,600) for font-weight don't seem to be supported!


unicode-range

Not yet supported.


font-stretch

Not yet supported.