テーブルの余白の個別指定
 


 
<table> に cellpadding="数字" と指定して、
テーブルの枠から文字までの間隔を決められますが、
これはあるセル内だけ、個別に設定する方法です。
 
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
 
◆◆ 個別指定その1。
 
<table border cellpadding="10"><tr><td> これは普通の設定。</td></tr><tr><td>どっちも同じように余白ができてます。 </td></tr></table>
 
これは普通の設定。
どっちも同じように余白ができてます。

 
−−−
 
指定したいセルに style="padding:数字;" と入れます。
 
<table border cellpadding="10"><tr><td> これは個別指定。</td></tr><tr><td style="padding:3;">こっちだけ余白が狭いです。</td></tr></table>
 
これは個別指定。
こっちだけ余白が狭いです。

 
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
 
◆◆ 個別指定その2。
 
また、
 上:padding-top:数字;
 右:padding-right:数字;
 下:padding-bottom:数字;
 左:padding-left:数字; と別々に固定もできます。

 
下記は、わかりやすいように  table全体を cellpadding=20" 個別指定の方の数値は全て「0」になってます。
 
padding-top:0;
個別指定。
こっちは上だけ余白なしです。

 
* * *
 
padding-bottom:0;
個別指定。
こっちは下だけ余白なしです。

 
* * *
 
padding-top:0;padding-bottom:0;
個別指定。
こっちは上下だけ余白なしです。

 
* * *
 
padding-left:0;padding-right:0;
個別指定。
こっちは左右だけ余白なしです。

 
* * *
 
padding-top:0;padding-right:0;
個別指定。
こっちは右上だけ余白なしです。

 
* * *
 
padding-left:0;padding-bottom:0;
個別指定。
こっちは左下だけ余白なしです。

 
・・・などなど。