2017-12-22 31 views
1

最近のCSSの傾向は、ユーザーのオペレーティングシステム用に設計されたフォントを使用する「システム」フォントスタックを使用することです。"システムフォントスタック"に "Roboto"を指定しても、実際に何が行われますか?

body { 
    font-family: -apple-system, BlinkMacSystemFont,"Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell,"Helvetica Neue", sans-serif; 
} 

フォントスタックのこのタイプは、ミディアム、Wordpressの、Githubに、ブートストラップ、Booking.comおよび他の多くで採用されている:通常、これは次のようになります。それらのすべてにはAndroidバージョン4の&までの「Roboto」が含まれています。私の質問は、なぜですか?このスタックから "Roboto"が削除されたらどうなりますか?

私のテストでは、アンドロイドデバイス(設定)のシステムフォントを切り替えても、ブラウザのデフォルトの「サンセリフ」フォントは常にRobotoです。

Robosをデフォルトのサンセリフフォントとして使用できないデバイスやブラウザがありますか?そうでない場合、Robotoはなぜこれらのフォントスタックに含まれていますか?

答えて

0

...これらのフォントスタックにはなぜRobotoが含まれていますか?

答えは非常に簡単です:を確認します。ここで

は、あなたがそれを翻訳する必要があり方法は次のとおりです。

Robotoフォントファミリは、システムにインストールされている場合(またはブラウザがそれを適用することが可能である)@font-face自身またはロードされたCSSのいずれかから、それはときに使用する必要があります前述のフォントファミリのいずれも正常に解決できません。

Robot現在のデバイスが実際にそれを作っていない場合は、デフォルトのシステムフォントであるので、ほとんどの場合、同じフォントをスタックで先に解決するので問題はありますか? 実際にはです。来年に何が新しいデバイスが発売されるかは誰にも知られておらず、Robotをスタックに入れて恩恵を受ける可能性があるからです。

ページへの影響を考慮すると、font-familyは実際にアプリケーションを最適化する場所ではありません。また、フォントファミリリストは1キロ長さにすることができます。解決される最初のフォントを越えるものはすべて無視されるので、技術的にはかなり安いです。

関連する問題