chromeがレンダリングするフォントを選択する方法を知りたいですか?Chrome開発者ツールを使用すると、計算されたフォントファミリーが異なることがわかりますので、これを求めていますレンダリングされたフォントファミリーからのものであり、これは混乱を招きます。Stackoverflowに関する同様の質問は、この特定のインスタンスではあまり役に立ちませんでした。
私のコンピュータフォントファミリは次のようになります。
font-family: museo-sans, sans-serif, Futura;
レンダリングされたフォントは次のようになります。
Helvetica—473 glyphs
この 記事 では、chromeは、レンダリングされたフォントをリストされた計算されたフォントにマップします。これは正確には何を意味し、なぜそれを行うのですか?ありますか?レンダリングするフォントを制御する方法は?
他のブラウザと同じです。最初のフォントが見つからない場合は、次のフォントを試します。ルールがなくなるまで、以下同様に続きます。一致するフォントがない場合、フォントは親要素からドキュメントレベルまで継承され、ブラウザのデフォルトフォントが選択されます。
この場合、表示されている順序は「実際のフォント」の後に「常に解決される汎用CSSクラスですが、どのフォントになるかについての保証はなく、それだけ」であるため、状況は少し奇妙です。 llはサンセリフフォントになり、その後に実際のフォント「futura」が続きます。
したがって、Chromeはmuseoを試しますが、見つかりません。一般的な「sans-serif」を確認し、既知のsans-serifフォントを選択します。通常はArialやHelveticaのようなものですが、 CSS仕様では、具体的にどのフォントにする必要があるかについては何も述べられていません。サンセリフフォントである必要があります。
ここでの奇妙な部分は、選択した順序が、最後の「futura」が決してチェックされないことを意味することです。ブラウザは 常に適切なフォントを見つけますserif
、sans-serif
、cursive
、fantasy
、またはmonospace