CSS Web安全フォントの組み合わせ

よく使われるフォントの組み合わせ

font-familyプロパティは複数のフォント名を指定し、「フォールバック」システムとして、ブラウザ/オペレーティングシステム間の最大限の互換性を確保します。ブラウザが最初のフォントをサポートしていない場合は、次のフォントを試します。

希望するフォントタイプがブラウザで見つからない場合、ブラウザは一般的なフォントタイプから類似したものを探します:

例

p{font-family:"Times New Roman", Times, serif}

試してみる »

以下は、よく使われるフォントの組み合わせと、一般的なフォントファミリーです。

Serif フォント

フォント テキスト例
Georgia, serif

This is a heading

This is a paragraph
"Palatino Linotype", "Book Antiqua", Palatino, serif

This is a heading

This is a paragraph
"Times New Roman", Times, serif

This is a heading

This is a paragraph

sans-serif フォント

フォント テキスト例
Arial, Helvetica, sans-serif

This is a heading

This is a paragraph
Arial Black, Gadget, sans-serif

This is a heading

This is a paragraph
"Comic Sans MS", cursive, sans-serif

This is a heading

This is a paragraph
Impact, Charcoal, sans-serif

This is a heading

This is a paragraph
"Lucida Sans Unicode", "Lucida Grande", sans-serif

This is a heading

This is a paragraph
Tahoma, Geneva, sans-serif

This is a heading

This is a paragraph
"Trebuchet MS", Helvetica, sans-serif

This is a heading

This is a paragraph
Verdana, Geneva, sans-serif

This is a heading

This is a paragraph

Monospace フォント

フォント テキスト例
"Courier New", Courier, monospace

This is a heading

This is a paragraph
"Lucida Console", Monaco, monospace

This is a heading

This is a paragraph
その他の拡張