余白したい(margin
)
margin: すべて;
margin: 上下 左右;
margin: 上 左右 下;
margin: 上 右 下 左;
marginプロパティで、要素の外側の余白を設定できます。
単位はpx
や%
などが使えます。
僕はrem
をよく使います。
margin
は一括指定プロパティ(shorthand property)なので、上下左右のマージンを一括で指定できるのですが、
引数の順番が覚えにくいです。
以下のように個別に設定したほうが、分かりやすくてよいかもしれません。
margin-top: 上;
margin-bottom: 下;
margin-left: 左;
margin-right: 右;
ブロック要素同士の隙間が詰め詰めになっていると窮屈に感じることがあります。 適切なマージンをつけると見やすくなると思います。
上下のマージンはインライン要素には適用されないので、注意してください。
ヒント
CSSを編集できない場合は、改行(<br>
タグ)で対応するケースもありますが、
本来であれば適切なマージン設定をすべきだと思います。