ホームページ >ウェブフロントエンド >CSSチュートリアル >Windows と Mac でフォントのアンチエイリアスが異なるのはなぜですか? @font-face を使用して修正するにはどうすればよいですか?
Windows と Mac でのフォント アンチエイリアシングの不一致: @font-face 解像度
Font Squirrel の @font-face キットを使用する場合、 Web 開発者は、Windows システムと Mac システムの間でフォント レンダリングの結果の不一致に遭遇することがよくあります。 Windows ブラウザでは、Mac ブラウザに比べてフォントが太くて粗いアンチエイリアシングで表示されます。
この問題を修正するために、Chrome では特に @font に含まれるフォント ファイル形式の順序を優先していることが判明しました。 -顔宣言。 SVG フォント ファイル形式をリストの先頭に移動し、Chrome がそれを優先できるようにすることで、アンチエイリアスの問題を解決できます。
改訂された @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; }
この改訂された宣言により、Chrome は SVG フォント ファイルを優先するようになり、一貫性のある高品質のアンチエイリアスが得られます。 Windows と Mac の両方のプラットフォームでのフォント レンダリング。
以上がWindows と Mac でフォントのアンチエイリアスが異なるのはなぜですか? @font-face を使用して修正するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。