CSS - border-spacing

概要

属性名	border-spacing
値	<length> <length>?
初期値	0
適用可能要素	テーブル要素、またはテーブル内要素
継承	継承しない
メディア	visual

サポート (説明)

CSS	IE/Edge	Firefox	Chrome	Opera	Safari
CSS2	8	1	1	4	1

説明

隣り合ったテーブルセルの枠線間の距離を指定します。値をひとつ指定した場合は上下左右の距離を、ふたつ指定した場合は左右の距離と、上下の距離を示します。border-collapse に separate が指定されている時のみ有効です。

値	説明
<length>	セルの枠線間の距離を指定します。

使用例

CSS

.sample-separate {
  border-collapse: separate;
  border-spacing: 50px 10px;
  border: 1px solid gray;
  margin: 1em;
}
.sample-separate td {
  border: 1px solid gray;
  background-color: #cc9999;
  width: 100px;
}

HTML

<table class="sample-separate">
  <tr><td>AAA</td><td>BBB</td></tr>
  <tr><td>CCC</td><td>DDD</td></tr>
</table>

表示

AAA	BBB
CCC	DDD

リンク

初版：1997年7月27日、最終更新：2021年8月8日

https://www.tohoho-web.com/css/prop/border-spacing.htm

CSS - border-spacing

概要

サポート (説明)

説明

使用例

関連項目

リンク