font-size:***;
font-size:***;は文字サイズを指定するプロパティで、適用した要素の文字のサイズが変更されます。
▼CSS
p{
font-size: 80%;
}
▼HTML
<p>この中の文字のサイズが80%に設定されます。</p>
▼表示
この中の文字のサイズが80%に設定されます。
サイズの設定方法にはいくつかあります。
数値で設定
数値で指定する場合は、数値+単位(px、pt、%、em、rem)で設定をします。
絶対サイズでの指定
文字の大きさを絶対サイズで指定する場合は、px、ptを単位にして設定をします。
ただし、ptはOSやディスプレイによって大きさが変動することがあり、表示が崩れることがありますので使用はあまりオススメできません。
相対サイズでの指定
文字の大きさを相対サイズで指定する場合は、%、em、remで設定をします。
%とemは親要素を基準としたサイズとなります。
キーワードで設定
キーワードで指定する方法もあり、こちらも絶対サイズ、相対サイズでの指定方法があります。
絶対サイズでの指定
キーワードで絶対サイズでの指定をする場合は、下記の7段階で指定をします。
xx-small | CSS2.1の仕様通りならば『60%』のフォントサイズとなります。 |
---|---|
x-small | CSS2.1の仕様通りならば『75%』のフォントサイズとなります。 |
small | CSS2.1の仕様通りならば『88.8%』のフォントサイズとなります。 |
medium | CSS2.1の仕様通りならば『100%』のフォントサイズとなります。 |
large | CSS2.1の仕様通りならば『120%』のフォントサイズとなります。 |
x-large | CSS2.1の仕様通りならば『150%』のフォントサイズとなります。 |
xx-large | CSS2.1の仕様通りならば『200%』のフォントサイズとなります。 |
標準値はmediumで設定されています。
相対サイズでの指定
相対サイズで指定する場合は、親要素のサイズに対しての大きさを指定します。
larger | 親要素のフォントサイズから一段階上のサイズを指定します。 |
---|---|
smaller | 親要素のフォントサイズから一段階下のサイズを指定します。 |