padding（内部余白）の指定

・ブロック要素内部の上下左右のマージン(余白)を設定。子要素に継承しない。

★書式
　padding:（スペースで区切った値)
　　・1個の値を設定した場合･･･上下左右が同じpaddingに
　　・2個の値を設定した場合･･･1つ目の値が上下，2つ目が左右paddingに
　　・3個の値を設定した場合･･･1つ目が上に，2つ目が左右に，3つ目が下paddingに
　　・4個の値を設定した場合･･･１つ目から順に上，右，下，左のpaddingに

　padding-top:(値)　･･･上のマージン(余白)
　padding-right:(値)　･･･右のマージン(余白)
　padding-bottom:(値)･･･下のマージン(余白)
　padding-left:(値)･･･左のマージン(余白)

★値
　・pt、px、in、em、cm、mm単位で値を指定
　・%指定･･･親要素の幅に対しての％で指定（上下余白も、高さでなく幅に対する％）

★Scriptプロパティ･･･
　＜padding＞＜paddingTop＞＜paddingRight＞＜paddingBottom＞＜paddingLeft＞

Sample

(1)padding:（1個の値)　style="padding:2mm"

子要素

(2)padding:（2個の値)　style="padding:2mm 10mm"

子要素

(3)padding:（3個の値)　style="padding:2mm 10mm 1mm"

子要素

(4)padding:（4個の値)　style="padding:2mm 10mm 1mm 5mm"

子要素

(5)上下左右個別にpaddingを指定する場合
　　　style="padding-top:2mm;padding-right:10mm;padding-bottom:1mm;padding-left:5mm"

子要素

Sample Source......................................................................>>>

<style type="text/css">
 .oya {width:80mm;background-color:#c0c0c0;border:1px solid navy}
 .ko {background-color:floralwhite;border:1px solid red} 
</style>

<p>(1)padding:（1個の値)　style="padding:2mm"</p> 
<div class="oya" style="padding:2mm"><p class="ko">子要素</p>
</div>
<p>(2)padding:（2個の値)　style="padding:2mm 10mm"</p> 
<div class="oya" style="padding:2mm 10mm"><p class="ko">子要素</p>
</div>
<p>(3)padding:（3個の値)　style="padding:2mm 10mm 1mm"</p> 
<div class="oya" style="padding:2mm 10mm 1mm"><p class="ko">子要素</p>
</div>
<p>(4)padding:（4個の値)　style="padding:2mm 10mm 1mm 5mm"</p> 
<div class="oya" style="padding:2mm 10mm 1mm 5mm"><p class="ko">子要素</p>
</div>
<p>(5)上下左右個別にpaddingを指定する場合</p> 
<div class="oya" style="padding-top:2mm;padding-right:10mm;
　　　　　　　　　　　　padding-bottom:1mm;padding-left:5mm">
　　　<p class="ko">子要素</p>
</div>