CSS3

@規則用記述子

font-family

[Edge]○。→●、mdn

フォント ファミリーの定義。

この記述子は、すべての［CSS フォントファミリ名の照合］に利用されることになる、フォント ファミリー名を定義する。@font-face 規則が妥当になるためには、これが要求される。それは、下層のフォント データに包含されているフォント ファミリー名を上書きする。すなわち、フォント ファミリー名が［利用者環境にて可用なフォントファミリの名前］と同じ場合、これは，その下層のフォント ― この記述子が記されているスタイルシートを利用する文書用の、下層のフォント ― を実質的に隠す。これにより、web 作者は、利用者環境に在るフォント ファミリー名との競合を気にすることなく、自由にフォント ファミリー名を選べるようになる。同様に、所与のフォント ファミリー名に対しては、プラットフォーム代用は利用しないものとする。

<family-name> ○

以下のCSSが組み込んであります：

<SPAN style="
 font-family:Test_Font, ＭＳ ゴシック;
 font-size:30px;
">ABCabc012…あいう</SPAN>

/*  可能なら WOFF2 フォントを読み込んで、
他の場合は WOFF フォントを読み込んで， 他の場合は OpenType フォントを利用する  */
@font-face {
  font-family: bodytext;
  src: url(ideal-sans-serif.woff2) format("woff2"),
       url(good-sans-serif.woff) format("woff"),
       url(basic-sans-serif.ttf) format("opentype");
}

テスト