8. 字下げ・余白・文字行の高さ・文字の間隔
CHECK POINTS
text-indent | margin | padding | line-height | letter-spacing
|
■字下げ
text-indent: x // x サイズ(em, px, %)
■余白による全体の字下げ
@ マージン(外側余白)
margin: x // x サイズ(em, px, %) * 全部
margin: x y // x 上下, y 左右 * 上から下
margin: x y z // x 上, y 左右, z 下 * 上から下
margin: x y z w // x 上, y 右, z 下, w 左 * 時計回り
margin-top: x // x 上のみ
margin-right: x // x 右のみ
margin-bottom: x // x 下のみ
margin-left: x // x 左のみ
例:<P>の上外側及び左外側を1字分空ける
P {margin-top: 1em; margin-left: 1em} // 1文字を 1em とした場合
A パディング(内側余白)
padding: x // x サイズ(em, px, %) * 全部
padding: x y // x 上下, y 左右 * 上から下
padding: x y z // x 上, y 左右, z 下 * 上から下
padding: x y z w // x 上, y 右, z 下, w 左 * 時計回り
padding-top: x // x 上のみ
padding-right: x // x 右のみ
padding-bottom: x // x 下のみ
padding-left: x // x 左のみ
例:<P>の左内側全体を1字分空ける
P {padding-left: 1em} // 1文字を 1em とした場合