@font-face src: local - ローカル フォントの使用を確保する

この質問は、ブラウザーが次のようなフォントをダウンロードしないようにする方法の問題を解決します。 @font-face ルールを使用する場合、ユーザーのシステムにすでにインストールされています。

質問で提供されている CSS は、によって推奨されている構文を使用しています。フォントリス。ただし、この問題は Chromium でも依然として発生しており、ブラウザ固有の問題であることが示唆されています。

解決策は、「local()」キーワードを利用してローカル フォント ファイルを優先することです。以下に示すように src プロパティを変更すると、ブラウザはまずローカル システムからフォントをロードしようとします:

src: local('DejaVu Serif'), url('DejaVuSerif-webfont.woff') format('woff'), url('DejaVuSerif-webfont.ttf') format('truetype'), url('DejaVuSerif-webfont.svg#webfontCFu7RF0I') format('svg');

この変更されたコードでは、'local('DejaVu Serif')' により、Chromium がインストールされている DejaVu Serif フォントを確認します。 Web からダウンロードする前にユーザーのシステムを確認してください。

このアプローチにより、最適なダウンロードが保証されます。フォントの読み込み。ブラウザはローカル コピーが利用可能な場合はそれを使用するため、不必要なダウンロードが回避され、ページの読み込み時間が短縮されます。