FontFace: display プロパティ

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

display は FontFace インターフェイスのプロパティで、フォントフェイスがどのように表示されるかを、それがダウンロードされ使用する準備ができているかどうかに基づいて決定します。このプロパティは CSS の font-display 記述子に相当します。

このプロパティが使用されると、フォントの読み込みは 3 つの期間を持つタイムラインを持ちます。最初の 2 つの期間の長さは、プロパティの値とユーザーエージェントに依存します。（下記参照。）

ブロック期間: ブラウザーは目に見えない形で代替フォントを準備します。この間にフォントフェイスが読み込まれると、それを使用してテキストが表示され、表示が完了します。
スワップ期間: フォントフェイスがまだ読み込まれていない場合は、代替フォントが表示されます。フォントフェイスが読み込まれると、代替フォントがダウンロードしたフォントと入れ替えられます。
失敗期間: フォントフェイスがまだ読み込まれていない場合は、代替フォントが表示され、入れ替えは行われません。

値

以下のいずれかの値を持つ文字列です。

auto: ユーザーエージェントが指定されたフォント表示方針を使用します。
block: フォントフェイスのブロック期間を短く、スワップ期間を無限にします。仕様ではブロック期間は 3 秒を推奨していますが、これはブラウザーによって異なる場合があります。
fallback: フォントフェイスのブロック期間とスワップ期間を短くします。仕様では、ブロック期間は 100 ミリ秒以下、スワップ期間は 3 秒以下を推奨していますが、この値はブラウザーによって異なる場合があります。
optional: フォントフェイスのブロック期間を短くし、スワップ期間はなしにします。仕様では 100 ミリ秒以下を推奨していますが、これはブラウザーによって異なる場合があります。
swap: フォントフェイスのブロック期間を 0 秒に、スワップ期間を無限にします。

Specification
CSS Font Loading Module Level 3 # dom-fontface-display

BCD tables only load in the browser