font-size

解説

フォントの大きさを指定します。数値で指定する場合は px や em や ex 等単位をつけて指定をし、パーセンテージで指定する場合は親のフォントサイズに対する割合で指定します。キーワードで指定する場合は以下のキーワードを使います(1段階上がると1.2倍のサイズ)。

xx-small
x-small
small
medium(標準)
large
x-large
xx-large

プロパティ情報

値:相対サイズ(smaller,larger)、絶対サイズ(xx-small,x-small,small,medium,large,x-large,xx-large)、長さパーセンテージのいずれか1つ。
初期値:medium
適用対象:全ての要素
継承:する
パーセンテージ:親要素のフォントサイズに対する割合
適用メディア:視覚
レベル:1〜2

参照

使用例

ソース

CSSの記述方法はスタイルシートってなに?も参照下さい。

div.sample1 {font-size: 6px; }
div.sample2 {font-size: 6em; }
div.sample3 {font-size: 6ex; }
div.sample4 {font-size: xx-small; }
div.sample5 {font-size: x-small; }
div.sample6 {font-size: small; }
div.sample7 {font-size: medium; }
div.sample8 {font-size: large; }
div.sample9 {font-size: x-large; }
div.sample0 {font-size: xx-large; }
HTMLの記述方法

<div class="sample1"><p>さんぷる</p></div>
<div class="sample2"><p>さんぷる</p></div>
<div class="sample3"><p>さんぷる</p></div>
<div class="sample4"><p>さんぷる</p></div>
<div class="sample5"><p>さんぷる</p></div>
<div class="sample6"><p>さんぷる</p></div>
<div class="sample7"><p>さんぷる</p></div>
<div class="sample8"><p>さんぷる</p></div>
<div class="sample9"><p>さんぷる</p></div>
<div class="sample0"><p>さんぷる</p></div>

表示結果

さんぷる

さんぷる

さんぷる

さんぷる

さんぷる

さんぷる

さんぷる

さんぷる

さんぷる

さんぷる