完全な @Font-Face 構文

Question

FTP 経由でフォントをインストールしようとしましたが、Bulletproof フォントの構文が間違っているというエラーが発生しました。私が何を間違えたのでしょうか？

編集: Jared の助けを借りてコードを修正しようとしていますが、まだ動作しています

@font-face {
フォントファミリー: 'Brasilero2018Free';
ソース:
    ローカル("ブラジル2018無料")、
    url('https://www.flordeibez.org/wp-content/主題/fonts/Brasilero2018Free.otf'),
    url('https://www.flordeibez.org/wp-content/主題/fonts/Brasilero2018Free.eot') format('embedded-opentype'),
    url('https://www.flordeibez.org/wp-content/主題/fonts/Brasilero2018Free.woff') format('woff'),
    url('https://www.flordeibez.org/wp-content/主題/fonts/Brasilero2018Free.svg') 形式('svg'),
    url('https://www.flordeibez.org/wp-content/主題/fonts/Brasilero2018Free.ttf') format('truetype');
}

欲しいもの: フォントがエラーなくインストールされ、Elementor Editor に表示される

Answer 1

あなたの構文は次のとおりです:

リーリー

各行でフォントの URL を再定義するだけです。したがって、ブラウザは最後のものだけを使用し、他のものは破棄されます。正しい基本構文は次のとおりです:

リーリー

古いブラウザに対応する必要がある場合は、追加のフォント形式を含めることができます。

注: 間違った format('ttf') を format('truetype') に変更しました。@herrstrietzel

に感謝します。