上下左右のマージンを個別に指定する

[新着] Webテンプレートを仮オープンしました


margin-***: ***;

ブラウザ
Internet Explorer Netscape Firefox Opera
参考
書式基本 要素名 クラス ID

margin-*** は、上下左右のマージンを個別に指定するプロパティです。
*** の部分には、toprightbottomleft が入ります)


div {
margin-top: 5px;
margin-right: 10px;
margin-bottom: 15px;
margin-left: 20px;
}


margin-top 上のマージンを指定します
margin-right 右のマージンを指定します
margin-bottom 下のマージンを指定します
margin-left 左のマージンを指定します

マージンの大きさは、数値+単位(px、他)か %(割合)、auto(自動)で指定します。


使用例

<html>
<head>
<title>TAG index Webサイト</title>

<style type="text/css">
<!--

p {
background-color: #85b9e9;
margin-left: 50px;
margin-right: 50px;
}


-->
</style>

</head>
<body>

<p>左右に50pxのマージン</p>

</body>
</html>

これをブラウザで見ると次のように表示されます

左右に50pxのマージン



[特集] レンタルサーバー比較 & サーバー選びのチェックポイント

サイト内検索について - ベーシック版