font-family 【フォントの種類】

[IE5] [IE6] [IE7] [Fx1] [Fx2] [Op6] [Op7] [Ns6] [Ns7]

font-familyプロパティは、フォントの種類を指定する事が出来ます。
ページを観覧する利用者の環境によって表示出来るフォントが限定されてしまいます。もしも指定されたフォントが表示されなかった場合に、代用フォントとしてイメージに近いフォントを候補として指定する事が出来ます。この場合、候補順に並べてカンマ(,)で区切って記述します。対応するフォントがユーザー環境に無い場合には、標準フォントで表示されます。

フォント名で指定する
「MS ゴシック」「MS 明朝」など、フォント名で直接指定します。フォント名にスペースが含まれている場合には、ダブルクォーテーション(")またはシングルクォーテーション(')で囲みます。

キーワードで指定する
sans-serif (ゴシック系のフォント)
serif (明朝系のフォント)
cursive (筆記体・草書体のフォント)
fantasy (装飾的なフォント)
monospace (等幅フォント)

font-familyの使用例

CSSファイル

.fontsp006 {
 font-family: "MS ゴシック",sans-serif;
}
.fontsp007 {
 font-family: "MS 明朝",serif;
}
.fontsp008 {
 font-family: Impact,Charcoal;
}

HTMLソース

<p class="fontsp006">
font-familyプロパティ使用例<br />
MS ゴシック(代用フォントsans-serif)です。
</p>

<p class="fontsp007">
font-familyプロパティ使用例<br />
MS 明朝(代用フォントserif)です。
</p>

<p class="fontsp008">
font-familyプロパティ使用例<br />
Impact(Sub font is Charcoal)
</p>

表示すると

font-familyプロパティ使用例
MS ゴシック(代用フォントsans-serif)です。

font-familyプロパティ使用例
MS 明朝(代用フォントserif)です。

font-familyプロパティ使用例
Impact(Sub font is Charcoal)

フォント関連項目

font フォントに関する指定をまとめて行う 
font-size フォントのサイズを指定する 
font-weight フォントの太さを指定する 
font-family フォントの種類を指定する 
font-style フォントをイタリック体・斜体にする 
font-variant フォントをスモールキャップにする 
font-size-adjust※ フォントのサイズを調整する 
font-stretch※ フォントを縦長・横長にする 

戻る

TOP