Go to information

border-spacing

border-spacingプロパティは border-collapseプロパティで表の枠(ボーダー)の表示モデルに分離ボーダーモデル(border-collapse : separate ;)が用いられた場合の各セルのボーダー間隔を指定するプロパティです。table要素の cellspacing属性と同様の機能です。

初期値
0
適用対象
表要素table要素
継承
する
メディア
visual

値は、"em", "px" などの単位識別子を伴う数値の長さで指定し、値を1つだけ指定する場合と値を2つ指定する場合の2種類の指定方法があります。値を1つだけ指定した場合は、水平・垂直の両方向の枠線の間隔に適用されます。2つ指定した場合は、「水平方向」「垂直方向」の順に枠線の間隔が適用されます。値を2つ指定する場合は、半角スペースで区切って続けて指定します。

border-spacingプロパティの実装状況

Windows版Internet Explorer
×
Firefox
Opera
Safari
Macintosh版Internet Explorer 5
×

CSS2 仕様における初期値は "0" なのですが、実際の主要視覚ブラウザの初期値は "1px" に設定されているようです。

サンプル

記述例
.separate {
border-collapse : separate ;
border-spacing : 5px 10px ;
}
table,th,td {
border : 1px solid #666 ;
}
表示例

半角スペース区切りで長さを2つ指定した場合、「水平方向」「垂直方向」の順に枠線の間隔が適用されます。このサンプル(border-spacing : 5px 10px ;)では、水平方向に "5px"、垂直方向に "10px" の枠線の間隔が指定されています。なお、Windows版・Macintosh版ともに Microsoft Internet Explorer は border-spacingプロパティに対応していません。

現在位置
  1. W3G
  2. CSS
  3. テーブル
  4. border-spacing
ナビゲーション
ステータス情報
作者
上田 遼
公開
2007-02-02T16:04:38+09:00
更新
2008-12-29T04:30:36+09:00
URI
http://w3g.jp/css/table/border-spacing
検索