CSSでの単位の指定方法
width、height、margin、padding、font-size等のCSSプロパティにおいて大きさ・長さを指定する単位です。
絶対単位による指定
レスポンシブを考慮せず厳密に単位を指定する方法です。例えば画像で、自動拡縮すると困るような場合は絶対単位を利用して厳密に単位を指定します。
px（:ピクセル）
ディスプレイの1ドットを示す値です。絶対単位を利用する場合はpxを利用するのが一般的です。
pxによる単位指定の利用例
CSS
.sample1 {
width: 200px;
height: 100px;
}
pxによる単位指定で注意する点
スマホの高精細ディスプレイ（例：iPhone4以降のRetinaディスプレイ）では1pxで縦横2倍の4倍のドットを持ち、
通常のディスプレイ：1px＝1ドット
高精細ディスプレイ：1px＝4ドット
という関係になります。
このため、画像の拡大による劣化を防ぎたいという意図でpxを指定する場合、高精細ディスプレイでは、例えば100px×100pxの画像であれば、各々半分の50px×50pxで指定します。もし100px×100pxで指定してしまうと画像が拡大されてしまいます。
相対単位による指定
レスポンシブを考慮した単位の指定方法です。
%（:パーセント）
親要素のサイズを100%としてその倍率を指定します。例えば親要素の幅を絶対単位の200pxと指定して、該当要素の幅を50%と指定すると100px固定となります。
一方、親要素の幅を相対単位の100%として該当要素の幅を50%を指定すると親要素のサイズが変わっても該当要素の幅は常に親要素の50%となります。
pxによる単位指定の利用例
CSS
.sample2 {
width: 50%;
}
em（:エム）
親要素のサイズを1として該当要素を0～1で指定します。該当要素を0.5emと指定すると、パーセントで50%と指定することと同じ意味になります。
相対単位としてはパーセントを利用するのが一般的なのですが、現場によってfont-size、margin、paddingプロパティの単位指定にはemを利用しているということがあります。
emによる単位指定の利用例
CSS
.sample3 {
font-size: 1.4em;
}