Cascading Style Sheet
Part 6
ここでは、フォントの指定の仕方を説明します。
フォントの各種プロパティについて
まず、フォントの各種プロパティについて説明します。これらは、下で述べるプロパティ"font"を使ってまとめて指定することが出来ます。
- font-style(文字の形状を設定します。)
値は、次のものがあります。
- normal
- italic
- oblique(斜体のフォントを指定します。italicとの違いは、標準のフォントをそのまま斜めにしたものだということです。)
- inherit
- font-weight(文字の太さを設定します。)
値は、次のものがあります。
- 100、200、300、400、500、600、700、800、900
- normal(400と同様です。)
- bold(700と同様です。)
- lighter、bolder(親(祖先)要素から継承した太さよりも、それぞれ一段階細いフォント、太いフォントを指定します。)
- inherit
- font-size(文字の大きさを設定します。)
値は次のものがあります。
- 数値+単位
- パーセント
- xx-small、x-small、small、medium、large、x-large、xx-large
- smaller、larger(親(祖先)要素から継承した大きさよりも、それぞれ一段階小さいフォント、大きいフォントを指定します。)
- inherit
- font-family(文字の種類を設定します。)
代表的なフォントファミリーとして、次のものがあります。
- serif(明朗体のフォント)
- sans-serif(ゴシック系のフォント)
- cursive(草書体(筆記体)のフォント)
- fantasy(装飾的なフォント)
- monospace(等幅のフォント)
値の指定の仕方は、表示させたい順に「,」で区切って並べます。
これらはフォントファミリー名なので、ユーザー側の環境で利用できるリストの最も始めに指定されているものが採用されます。例えば、私の環境(Win95、IE4)ではcursiveをfont-familyの先頭に指定すると、日本語が文字化けします(具体的に全て□で表示されます)。従いまして、これらのフォントファミリーは、フォントファミリー名にも依りますが、指定した全てのフォントが有効でない場合の最終的な指定として、使用するべきでしょう。
フォントの各種プロパティをまとめて指定する。
上で述べたフォントの各種プロパティをまとめて指定することが出来ます。
次のプロパティを使います。line-heightについては、Part 3を参照して下さい。
font : font-style font-weight font-size/line-height font-family
例えば、P要素に、形状をitalic、太さをbold、大きさを12pt、行の高さを15pt、種類をserifに指定する場合は次のようにします。
P { font : italic bold 12pt/15pt serif }
Part 1 | Part 2 | Part 3 | Part 4 | Part 5 | Part 6 | Part 7
top up index new search mail