DOM
：FontFaceインターフェイス
：FontFace コンストラクター
編集：2022.02.10 by T.A.
新しい FontFace オブジェクトを作ります。→MS（en）
fontface= new FontFace(family,source[,descriptors])
| family
| フォントプロパティのフォント･フェイスの値として使用される名前を指定します。@font-face の font-family 記述子と同じタイプの値を取ります。
|
|---|
| source
| フォントソース。次のいずれかになります：
| URL
| ¶String。
|
|---|
| data
| バイナリー･フォント･データ
|
|---|
|
|---|
| descriptors オプション
| オブジェクトとして渡されるオプションの記述子のセット。@font-face で使用可能な任意の記述子を含めることができます。
ascentOverride
| @font-face の ascent-override の許容値を使用します。
|
|---|
descentOverride
| @font-face の descent-override の許容値を使用します。
|
|---|
featureSettings
| @font-face の font-feature-settings の許容値を使用します。
|
|---|
lineGapOverride
| @font-face の line-gap-override の許容値を使用します。
|
|---|
stretch
| @font-face の font-stretch の許容値を使用します。
|
|---|
style
| @font-face の font-style の許容値を使用します。
|
|---|
unicodeRange
| @font-face の unicode-range の許容値を使用します。
|
|---|
variant
| @font-face の font-variant の許容値を使用します。
|
|---|
variationSettings
| @font-face の font-variation-settings の許容値を使用します。
|
|---|
weight
| @font-face の font-weight の許容値を使用します。
|
|---|
|
|---|
例
async function loadFonts(){
const font = new FontFace('myfont', 'url(myfont.woff)'); //wait for font to be loaded
await font.load(); //add font to document
document.fonts.add(font); //enable font with CSS class
document.body.classList.add('fonts-loaded');
}
テスト
ここに表示