CSS: table(テーブル)のボーダーの隙間をなくす設定
CSS で table(テーブル)の border(ボーダー・枠線)の隙間をなくすには、 border-collapse プロパティを使用します。
「border-colla;se: collapse;」とすることで、ボーダーの隙間がなくなり、
重ねて表示されます。
初期値は「separate」となっていますので、何も設定しない場合はボーダーが分離されます。
border-collapse: collapse; /* 重ねて表示 */
border-collapse: separate; /* 分離させて表示 初期値 */
初期値 border-collapse: separate;
初期値「separate」の場合は次のようにボーダーが分離されています。
データ | データ |
データ | データ |
データ | データ |
「border-collapse: collapse;」とした場合
「border-collapse: collapse;」とした場合は、次のように ボーダーの隙間がなくなり、重ねて表示されます。
データ | データ |
データ | データ |
データ | データ |
table {
border-collapse: collapse;
}