ホームページ > ウェブフロントエンド > CSSチュートリアル > Google Chrome にはフォント スムージングの問題がありますか?どうすれば解決できますか?

Google Chrome にはフォント スムージングの問題がありますか?どうすれば解決できますか?

Barbara Streisand
リリース: 2024-12-01 10:44:16
オリジナル
419 人が閲覧しました

Does Google Chrome Have Font Smoothing Issues, and How Can They Be Fixed?

Google Chrome はフォント スムージングを提供しますか?

Google Chrome は、特に小さいフォント サイズの場合、フォント レンダリングに長い間苦労してきました。問題は続いていますが、問題を軽減するための重要な開発と潜在的な解決策があります。

ステータス更新 (2013 年 12 月)

2014 年 6 月現在、Chrome バージョン 37フォントレンダリングの問題の修正が含まれます。現在の Chrome バージョン (2013 年 5 月現在) には、@import や Google の webfont.js などのさまざまな方法でフォントを読み込むときの適切な解決策がありません。

CSS トリックを使用した回避策

決定的な修正はまだありませんが、CSS のトリックを使用して、レンダリングされた画像を「滑らかにする」ことで問題を部分的に軽減できます。フォント。回避策の 1 つは、-webkit-text-ストローク プロパティを使用してテキストに細いストロークを追加することです:

-webkit-text-stroke: 0.Xpx;
ログイン後にコピー

または、RGBA 構文を使用して、より微妙な効果を得ることができます:

-webkit-text-stroke: 1px rgba(0, 0, 0, 0.1);
ログイン後にコピー

別の回避策は、偽のシャドウを適用することです。 text:

text-shadow: #fff 0px 1px 1px;
ログイン後にコピー

実際の解決策 (自己ホスト型フォント)

自己ホスト型フォントの場合、Web フォントを特定の順序。 TTF/OTF フォント ファイルに関しては、より広範なブラウザ サポートが提供されるようになり、より良い結果が得られる可能性があります。

Google による積極的な開発

Google Chrome 開発チームは積極的に取り組んでいます。フォントのレンダリングの問題について。解決タイムラインの最新情報は、公式バグ レポートで入手できます。

比較例

良い点:

  • 左: Firefox 23、右: Chrome 29
  • 上: Firefox 23、下: Chrome 29

マイナス:

  • Chrome 30
  • クロム29

ストロークの回避策の使用:

  • 最初の行: デフォルト
  • 2 行目: -webkit-text-ストローク: 0.3px;
  • 3 行目: -webkit-text-ストローク: 0.6px;

ブログ投稿のリファレンス

問題のステータスの詳細と最新情報については、以下を参照してください。ブログ投稿: Google Chrome での醜いフォント レンダリングを修正する方法

以上がGoogle Chrome にはフォント スムージングの問題がありますか?どうすれば解決できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート