border-spacing

解説

隣接するセルの線と線の間隔を指定します。border-collapseプロパティの値がseparateのときのみ有効です。初期値は0となっていますが、多くのブラウザで1pxとなっているようです。

値を1つ指定上下左右の間隔を指定
値を2つ指定記述した順に上下、左右の間隔を指定

プロパティ情報

値：長さを1つか2つ
初期値：0
適用対象：表要素
継承：する
パーセンテージ：不可
適用メディア：視覚
レベル：2

参照

table-layout caption-side border-collapse border-spacing empty-cells

使用例

ソース

CSSの記述方法はスタイルシートってなに？も参照下さい。

table.sample1 {border: solid 1px #ff0000; border-collapse: separate; border-spacing: 8px;}
td.sample1    {border: solid 1px #0000ff; width: 100px;}
HTMLの記述方法

<table class="sample1">
<tr><td class="sample1">1</td class="sample1"><td class="sample1">2</td class="sample1"><td class="sample1">3</td class="sample1"></tr>
<tr><td class="sample1">4</td class="sample1"><td class="sample1">5</td class="sample1"><td class="sample1">6</td class="sample1"></tr>
<tr><td class="sample1">7</td class="sample1"><td class="sample1">8</td class="sample1"><td class="sample1">9</td class="sample1"></tr>
</table>

表示結果

123
456
789