ボックスのマージンの幅をまとめて指定する
margin
{
margin
marginプロパティは、ボックスの外側の余白(マージン)をまとめて指定するショートハンドです。
初期値 | 各プロパティに準じる |
---|---|
継承 | なし |
適用される要素 | テーブル関連要素以外のすべての要素。ただし、displayプロパティでtable-caption、table、inline-tableが指定された要素には適用可能 |
モジュール | CSS basic box model |
値の指定方法
指定できる値はmargin系プロパティと同様です。値は半角スペースで区切って4つまで指定でき、それぞれ上辺、右辺、下辺、左辺に適用されます。省略した場合は以下のような指定になります。
- 値が1つ すべての辺に同じ値が適用されます。
- 値が2つ 1つ目が上下辺、2つ目が左右辺に適用されます。
- 値が3つ 1つ目が上辺、2つ目が左右辺、3つ目が下辺に適用されます。
サンプルコード
.m1{margin: 0;} .m2{margin: 15px; } .m3{margin: 30px; } .m4{margin: 60px 20% 0px 1em;}