web-dev-qa-db-ja.com

@ font-face src：local-ユーザーが既にフォントを持っている場合にローカルフォントを使用する方法

@font-faceを使用して、ユーザーが既にフォントを持っている場合にブラウザーがフォントをダウンロードしないようにする正しい方法は何ですか？

@ font-faceを使用してDejaVuを定義していますが、これはシステム（Linux）に既にインストールされています。 Firefoxはフォントをダウンロードしていませんが、Chromiumは毎回ダウンロードしています！

font squirrel および その質問 に基づくCSSコードは次のようになります。

@font-face {
    font-family: 'DejaVu Serif';
    src: url('DejaVuSerif-webfont.eot');
    src: local('DejaVu Serif'), url('DejaVuSerif-webfont.woff') format('woff'), url('DejaVuSerif-webfont.ttf') format('truetype'), url('DejaVuSerif-webfont.svg#webfontCFu7RF0I') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* ... @font-face definitions for italic and bold omitted ... */

@font-face {
    font-family: 'DejaVu Serif';
    src: url('DejaVuSerif-BoldItalic-webfont.eot');
    src: local('DejaVu Serif Bold Italic'), url('DejaVuSerif-BoldItalic-webfont.woff') format('woff'), url('DejaVuSerif-BoldItalic-webfont.ttf') format('truetype'), url('DejaVuSerif-BoldItalic-webfont.svg#webfontQAewh7pf') format('svg');
    font-weight: bold;
    font-style: italic;
}
cssfont-face
61
dbarbosa

最初にローカルファイルを確認したい場合：

@font-face {
font-family: 'Green Sans Web';
src:
    local('Green Web'),
    local('GreenWeb-Regular'),
    url('GreenWeb.ttf');
}

より詳細な説明があります ここで何をすべきか 。

79
Thariama