HTML CSS 講座 トップページへ

ホームページ作成 いまさらHTML,CSS講座

|  Home  |  ホームページ作成の知識  |  HTML 講座  |  HTML TABLE 講座  |  スタイルシート(CSS) 講座  |  携帯サイト 作成 講座  |
[HTMLテンプレートカテゴリ] [未分類カテゴリ]

いまさらHTML,CSS講座トップ > HTML4.01 TABLE 講座インデックス > テーブル table 余白
様々なブックマークサービスがご利用頂けます。

テーブル 余白

■ cellpadding属性
表のセル内の余白を指定します。
値は単位をつけないピクセル数で、指定がない場合の初期値は、多くの視覚ブラウザで 1ピクセルが指定されています。
ソース  ソース 基本
<table cellpadding="10">
 <tr><td>1972</td></tr>
</table>
表示  表 示
 代替指定
th 要素, td 要素に paddingプロパティ を指定する事により、スタイルシートで代替指定することができます。
■ cellspacing属性
表のセルとセルを区切る罫線の太さを指定します。
border属性の指定がない場合は枠線が表示されませんので、結果、セルとセルの間の余白を指定するとも言えます。
値は単位をつけないピクセル数で、指定がない場合の初期値は、多くの視覚ブラウザで 2ピクセルが指定されています。
ソース  ソース 基本
<table cellspacing="10">
 <tr><td>1972</td><td>1973</td></tr>
</table>
表示  表 示
 代替指定
border-spacingプロパティで代替指定できますが、未対応のブラウザが多い為、説明は省略します。

テーブル 余白 スタイルシート
■ paddingプロパティ
上下左右の枠内の余白(パディング領域)を指定します。
th 要素, td 要素にpaddingプロパティを指定することでpadding属性の代替指定ができます。
内容領域、マージン、パディング、ボーダーのイメージ
padding: の引数は 1〜4個指定が可能で、それぞれ、下のように解釈されます。
padding: 1px 2px 3px 4px ;
padding: 1px 2px 3px ;
padding: 1px 2px ;
padding: 1px ;
上 1px、右 2px、下 3px、左 4px
上 1px、左右 2px、下 3px
上下 1px、左右 2px
上下左右 1px
表示  上下左右のパディングを個別に指定する場合
padding-top: 2px ;
padding-bottom: 2px ;
padding-right: 2px ;
padding-left: 2px ;
上辺に 2pxの余白
下辺に 2pxの余白
右辺に 2pxの余白
左辺に 2pxの余白
ソース  ソース 基本
<table>
 <tr><td style="padding : 10 ; ">1972</td></tr>
</table>
表示  表 示

(C) いまさらHTML CSS講座 2002-2008 All right reserved