【CSS】スタイルシートでのプロパティの値で指定する単位

こんにちは!CodeClub965で講師をしているKです!

今回は、スタイルシートのプロパティの値として、文字の大きさや画像の大きさなどを指定するときに使う「単位」についてまとめておきたいと思います。

絶対指定と相対指定

線の長さや大きさなどを指定する時の単位には以下の2つがあります。

・絶対指定・・・直接サイズを指定する
・相対指定・・・基準となる値に対して比率でサイズを指定する

絶対指定

単位
inインチ(1インチ=2.54cm)
cmセンチメートル
mmミリメートル
ptポイント(72pt=1in)
pcパイカ(1pc=12pt)

相対指定

単位
em1em(エム)が、基準となるフォントサイズ(※)になります。
そのため基準フォントが10ptの場合、1.5emと指定するとフォントは15ptを意味します。
ex基準フォントの「x」の高さ(x-height)に相当します。
滅多に使いません。
pxコンピュータの画面の画素単位です(ピクセル)。
同じサイズの画面でも解像度の設定によって大きさが変わります。
%サイズを100分比で指定します。

※「基準となるフォントサイズ」
ボックスのサイズ指定などの場合はその「要素」のフォントサイズです。
font-sizeプロパティを設定する場合のみ、「親要素」のフォントサイズが基準となります。

最後に

今回はCSSでの単位を一覧でまとめました。
もし単位を指定するときに気になったら参考にしてみてください(^^)

基本の知識としておさえておきましょう!

それでは、また!