CSS border-collapse

スタイルシート属性 border-collapse は、表(テーブル)の枠線との間の大きさを指定します。

書式

border-collapse: collapse

属性値

collapse
以下の値から選びます。
説明
collapse隣のセルの枠線と重ねて表示
separate隣のセルの枠線と離して表示
inherit上位のスタイルを継承

初期値

separate

適用対象

以下に示す要素に対して、border-collapse プロパティを適用できる。

継承

親要素の border-collapse プロパティの値が子要素へ継承される。

使用例と表示サンプル

次に、隣のセルの枠線と離して表示する表の例を示します。

<table border="1" style="border-collapse:separate">
  <tr>
    <td>border-collapse</td>
    <td>separate</td>
  </tr>
</table>
border-collapseseparate

次に、隣のセルの枠線と重ねて表示する表の例を示します。

<table border="1" style="border-collapse:collapse">
  <tr>
    <td>border-collapse</td>
    <td>collapse</td>
  </tr>
</table>
border-collapsecollapse

関連記事

参考文献

World Wide Web Consortium (2025) Cascading Style Sheets (CSS) Level 2