NO.63 マージン

ボックスのプロパティにマージン・パディング・ボーダー等が含まれるようですが、ここでは分ける事にしました。

margin-top,margin-right,margin-bottom,margin-left
上下左右のマージン(余白)を個別に指定できます。
Value: <length> | <percentage> | auto

<div style="margin-top:2px;margin-right:4px;margin-bottom:3px;margin-left:4px;">This source is test.</div>

margin
上下左右のマージン(余白)を一括指定できます。
Value: [ <length> | <percentage> | auto ]{1,4}

<style type="text/css">
<!--
.t1{margin:3px;}     /*上下左右に3pxの余白*/
.t2{margin:4px 5px;}     /*上下4px,左右5pxの余白*/
.t3{margin:6px 7px 8px;}     /*上6px,左右7px,下8pxの余白*/
-->
</style>
<div class=t1>This source is test.</div>
<div class=t2>This source is test.</div>
<div class=t3>This source is test.</div>

上記の内容を応用
◆HEAD内の記述 <style type="text/css">  </style>
◆BODY内の記述 test:<br> <div class=zzA>margin-top:15px;margin-bottom:16px;margin-right:17px;margin-left:18px;</div><br> test:<br> <div class=zzB>margin:20px 30px;</div><br>
◆実行例

test:

margin-top:15px;margin-bottom:16px;margin-right:17px;margin-left:18px;

test:

margin:20px 30px;

前に戻る　次に進む

SEO		[PR] 爆速!無料ブログ無料ホームページ開設無料ライブ放送