1. Home
  2. HTMLタグ
  3. HTMLの基本
  4. フォントの表示例

フォントの表示例



フォントの指定方法

使用するフォントは、font要素face属性、またはスタイルシートのfont-familyプロパティで指定することができます。

※具体的な指定方法については、「(HTML)フォントを指定する」と「(CSS)フォントを指定する」をご覧ください。

■face属性で指定する場合
フォント名による指定が可能です。
■font-familyプロパティで指定する場合
フォントの大まかな種類とフォント名による指定が可能です。

無指定の場合

フォントの指定がない場合は、ブラウザに設定されたデフォルトのフォントが使用されます。

【デフォルト】

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

フォントの大まかな種類で指定した例

スタイルシートで指定する場合は、次のようにフォントの大まかな種類で指定することができます。

※使用されるフォントは、ユーザーの環境により異なる場合があります。

【sans-serif】 ゴシック体系

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【serif】 明朝体系

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【cursive】 筆記体系

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【fantasy】 装飾系

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【monospace】 等幅系

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

フォント名で指定した例

フォント名で指定した場合の表示例です。

※指定したフォントがインストールされていない場合は、デフォルトのフォントで表示されます。

【MS ゴシック】 日本語フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【MS Pゴシック】 日本語フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【MS 明朝】 日本語フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【MS P明朝】 日本語フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ホームページ制作情報HTMLインデックス

ホームページ制作情報HTMLインデックス

【Arial】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Century】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Century Gothic】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Comic Sans MS】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Courier】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Courier New】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Impact】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Symbol】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Times New Roman】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ

【Verdana】 英文フォント

ABCDEFGHIJKLMNOPQRSTUVWXYZ

ABCDEFGHIJKLMNOPQRSTUVWXYZ


HTMLの基本

ページの先頭へ


inserted by FC2 system