CSS border-collapse

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

書式

border-collapse: collapse

属性値

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

使用例と表示サンプル

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

<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 (2022) CSS 2