CSSでフォントのサイズを変更する方法/font-sizeの使い方

converse IT

記述した文字のサイズを任意のサイズに変更できる、font-sizeプロパティのご紹介となります。

Advertisements

font-sizeの使い方

サイズにはpx(ピクセル)の他、普通の1文字のサイズを1emとしたem、普通の1文字のサイズを基準に指定できる%などが使えます。
x-small~x-largeという文字指定も可能です。

フォントサイズの指定
font-size:(大きさ);

たとえばこれが16pxこれが18pxこれが20pxです。
(例)CSSで次のように指定しておいて、「fontsize」というクラスに16pxのフォントサイズを登録しておきます。

.fontsize{
font-size: 16px;
}

HTMLでspanタグにfontsizeクラスを適用することで、タグの中の文字列が16pxで表示されます。

<span class = “fontsize”>16px</span>

1em(当サイト基準)
1.2em
1.5em
100%(当サイト基準)
80%
130%
medium(当サイト基準)
x-small
small
large
x-large

コメント