font-size
font-sizeは、文字のサイズを指定するスタイルです。
解説
文字サイズの指定方法は、キーワード、割合、数値の３種類があります。
構文
構文は以下になります。
font-size: 値;
値
font-sizeには以下の値が指定できます。
| 値 | 説明 |
|---|---|
| キーワードで指定 | 文字サイズををキーワードで指定します。 xx-small、x-small、small、medium、large、x-large、xx-large の７種類が指定できます。smallが標準サイズです。 （例）font-size:x-large; |
| 割合で指定 | 文字サイズを割合で指定します。 100%が標準サイズです。 （例）font-size:120%; |
| 数値で指定 | 文字サイズをpx、em等の数値で指定します。 （例）font-size:14px; font-size:1.2em; |
font-sizeの初期値は「medium」です。
サンプル
文字サイズを「xx-large」にする
.sample01 {
font-size:xx-large;
}
<div class="sample01">文字サンプルです。</div>
文字サンプルです。
文字サイズを「80%」にする
.sample02 {
font-size:80%;
}
<div class="sample02">文字サンプルです。</div>
文字サンプルです。
文字サイズを「18px」にする
.sample03 {
font-size:18px;
}
<div class="sample03">文字サンプルです。</div>
文字サンプルです。
備考
- mediumがデフォルトサイズなので、mediumサイズにしたい場合は明示的にサイズを指定しなくてもOKです。
関連項目
- font：フォント関連のスタイルを一括して指定する
- font-family：フォントの種類を指定する
- font-size：文字のサイズを指定する
- font-style：文字のスタイルを指定する
- font-variant：フォントをスモールキャップにする
- font-weight：文字の太さを指定する
