フォント属性を次の表に示す。
属性 | 内容 |
---|---|
font-family | 表示するフォントの種類を指定する |
font-style | フォントのスタイルを指定する |
font-variant | フォントのバリエーションを指定する |
font-weight | フォントの太さを指定する |
font-size | フォントのサイズを指定する |
font | 上記5つの略表記 |
表示するフォントの種類を指定する属性。値には具体的なフォント名(例えば、MS 明朝)、あるいは一般化されたフォント名を指定する。
一般化されたフォント名は次のとおり。
フォント名 | 読み |
---|---|
serif | セリフ |
sans-serif | サンセリフ |
cursive | カーシブ |
fantasy | ファンタジー |
monospace | モノスペース |
実際に表示されるフォントはブラウザの種類、設定により異なる。
フォント名を指定してページを制作するのはあまり意味がありません。なぜなら、ページのすべての閲覧者が自分と同じフォントを使っているとは限らないからです。
フォントのスタイルを指定する属性。指定できる値は表のとおり。
値 | 意味 |
---|---|
normal | 標準のフォントを使用する |
italic | イタリック体のフォントを使用する |
oblique | 斜体のフォントを使用する |
この属性では通常のスタイルと斜体のスタイルを指定できる。italicとobliqueの表示は変わらない。
フォントのバリエーションを指定する属性。指定する属性はnormalとsmall-capsのいずれか。
フォントの太さを指定する属性。指定できる値を表に示す。
値 | 意味 |
---|---|
normal | 標準フォントを指定 |
bold | ボールド体フォントを指定 |
bolder | 現在のフォントより一段太いフォントを指定 |
light | 現在のフォントより一段細いフォントを指定 |
100〜900 | 100刻みで9段階の太さのフォントを指定 |
フォントの大きさを指定する属性。指定できる値をつぎの表に示す。
値 | 意味 |
---|---|
xx-small x-small small mediuml arge x-large xx-large |
フォントの相対的なサイズ指定 |
長さ | 数値での直接指定 |
xx% | 現在のフォントのパーセントで指定 |
この属性はfont-family、font-style、font-variant、font-weight、font-size、line-heightの6つの属性をまとめて指定できる。次の例のように値を空白文字で区切る。
P { font: 12pt/14pt sans-serif } P { font: 80% sans-serif } P { font: x-large/110% "new century schoolbook", serif } P { font: bold italic large Palatino, serif } P { font: normal small-caps 120%/120% fantasy }