@font-face キットのレンダリングが Windows と Mac で異なるのはなぜですか?

Windows と Mac における @font-face キットのアンチエイリアシングの不一致

Font のフォントを使用した @font-face キットの実装Squirrel は、Windows オペレーティング システムと Mac オペレーティング システムの間でレンダリングに顕著な違いを引き起こす可能性があります。具体的には、Windows プラットフォームではフォントの太さがより顕著になり、滑らかさに欠ける可能性があります。

この問題を解決するために、Windows 上の Chrome は Font Squirrel によって生成されたデフォルトの CSS を特に嫌っていることが判明しました。解決策は、@font-face ルールの src プロパティの順序を変更することです。

SVG 形式の行をリストの先頭に移動することで、アンチエイリアシングの問題を解決できます。変更された @font-face コードの例は次のとおりです:

@font-face {
    font-family: 'HLC';
    src: url('/_styles/hlc/hl-webfont.svg#HLC') format('svg'),
         url('/_styles/hlc/hl-webfont.eot') format('embedded-opentype'),
         url('/_styles/hlc/hl-webfont.woff') format('woff'),
         url('/_styles/hlc/hl-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

この変更は、Windows システムと Mac システム間のアンチエイリアシングの不均衡を解決するのに効果的であることが証明されており、フォントが必要なレベルの滑らかさと明瞭さを確実に維持します。 .

以上が@font-face キットのレンダリングが Windows と Mac で異なるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。