いちから始めるホームページ作成

HTML・CSSのことがよくわかる初心者から始めるホームページ制作

margin

marginとは?

marginは、タグの外側の余白を指定するCSSです。

marginの使い方

上下左右個別に指定することができ、値がいくつか同じ場合は、まとめることもできます。

また、top(上)、right(右)、bottom(下)、left(左)で一方向だけ指定することもできます。

タグの内側に余白を付けたい場合はpaddingを使います。

記述方法

marginは以下のように記述します([]内は値が指定する方向)

上下左右が同じ場合[上下左右]

margin:10px;

上下が同じ値(10px)、左右が同じ値(20px)の場合[上下][左右]

margin:10px 20px;

上と下が別の値(上10px、下30px)、左右が同じ値(20px)の場合[上][左右][下]

margin:10px 20px 30px;

個別に値(上10px、右20px、下30px、左40px)を指定する場合[上][右][下][左]

margin:10px 20px 30px 40px;

上だけにmarginを指定する場合

margin-top:10px;
HTMLタグ
CSS
一口メモ
サンプルソース
用語集