サイトマップ
トップページ > CSS > プロパティ一覧 > margin(最終修正日:2007-03-06)

marginプロパティ

marginプロパティの概要
機能 要素のマージンを定義
指定可能な値 長さ, パーセント
初期値 なし
継承 しない
適用可能なボックス 全て

marginプロパティは、要素のマージン(余白)を定義します。marginプロパティの余白は、paddingプロパティとは違い、ボーダーの外側の余白を定義します。また、余白部分は、ネストされる要素の背景色が適用されます。

尚、marginプロパティを指定しない場合は、マージンは取られません(「margin:0」ということになります。)。


h3 {
    margin: 40px;
}
div {
    margin: 30px;
    border: 1px solid #000;
}
li {
    border: 1px solid #000;
}

確認画面

上下左右のマージンを個別で指定するために、次のようなプロパティも用意されています。

プロパティ名 機能
margin-top 要素の上側のマージンの定義
margin-right 要素の右側のマージンの定義
margin-bottom 要素の下側のマージンの定義
margin-left 要素の左側のマージンの定義
margin-top、margin-right、margin-bottom、margin-leftプロパティの概要
機能 要素のマージンを上下左右で個別に定義
指定可能な値 長さ, パーセント
初期値 0
継承 しない
適用可能なボックス 全て

h2, h3, h4, h5 {
    border: 1px solid #000;
}
h2 {
    margin-top: 80px;
}
h3 {
    margin-right: 80px;
}
h4 {
    margin-bottom: 80px;
}
h5 {
    margin-left: 80px;
}

確認画面
前ページborder-xxx-color 上へこのページの先頭 padding次ページ
Copyleft copyLeft 2008 W-D-L.NET