WEB開発にて使用する単位の話

単位の一覧と用途

	説明	用途
px(pt,cm)	画面やほかの要素のサイズに影響されない固定値	borderや小さい飾り
em	親要素のフォントサイズに対する相対値	leter-spacingや疑似要素との間隔
rem	ルート要素のフォントサイズに対する相対値	文字、margin padding
%	親要素に対する相対値	親要素いっぱいに広げたい画像
vh vw	画面サイズ viewport height widthに対する相対値	モーダルwindowなど画面サイズに合わせて可変させたい要素

htmlにfont-size: 0.625rem（10px）を指定することで子要素でのピクセル指定が見やすくなる14px=1.4rem

閲覧環境間の問題（文字サイズを指定している場合など）、レスポンシブ対応がし易くなる為
メディアクエリでhtmlの元サイズを変更するだけで、全ての大きさをまとめて変更可能