Google Web フォントの「Lato」フォントを使用しており、サファリ以外のすべてのブラウザで問題なく表示されます。
私はそれを使用していますfont-weight:100;
さまざまなブラウザのスクリーン ショットを次に示します。非常に薄くレンダリングする原因は何ですか？font-weight:300;または、サファリ専用にレンダリングするように設定できる方法がある場合は?
私はまた、問題の js フィドルを作成しました - http://jsfiddle.net/qLHuc/1/
ファイアフォックス
クロム
サファリ
理由はわかりませんが、Safari はそのページの小さなフォント サイズでサブピクセル アンチエイリアスを無効にしています。を適用することで修正できます-webkit-font-smoothing: subpixel-antialiased。ここを参照してください：http://jsfiddle.net/qLHuc/3/
ただし、より重いフォントの使用を検討する必要があると思います。これを Windows でテストしましたか? 非常に軽く見えるでしょう。サブピクセル アンチエイリアシングが有効な場合、OSX はテキストを非常に重くレンダリングします。テキストが暗い背景または色付きの背景に対してある場合は特に重くなります。Safari のスクリーンショットに表示されるものは、OSX を使用していないユーザーに表示されるものと似ています。
font-weight:300 で Google フォントを使用しようとしたときにも、同様の問題に直面しました - サファリを除くすべてのブラウザで正常に動作します。
cssプロパティの下に追加することでこれを解決しました。
-webkit-font-smoothing: アンチエイリアス;