このサイトついて

このサイトではホームページを
作りたいという方のために、
HTML・CSSの解説
便利なソフト・本などの紹介
レンタルサーバの紹介
などを行っています。

マージンを設定したい

対応ブラウザ

マージンは領域の外側の余白を設定します。
マージンの設定は必ず使うようになるので確実に覚えましょう。

マージンに関するプロパティ

マージンは上下左右を個別に設定することができます。

margin-top:・・・・上のマージンを設定する
margin-bottom:・・・下のマージンを設定する
margin-left:・・・左のマージンを設定する
margin-right:・・・右のマージンを設定する

また、複数の値を一気に記述することで上下左右の設定をすることができます。

margin:10px;/*上下左右*/
margin:10px 20px;/*上下、左右*/
margin:10px 20px 30px;/*上、左右、下*/
margin:10px 20px 30px 40px;/*上、右、下、左*/

■補足■
マージンの値には数値（pxやpt）・割合（％）・autoがあり、
マイナスの数値を指定することができます。
また、領域の外を設定するプロパティとしてパディング(padding)があります。

サンプルページ

<p>の設定はmargin:10px 20px 30px 40px;にしました。

戻る