tableの隙間を無くす方法

こんにちは！

htmlでtableを作ると隙間ができますよね？

f:id:aki-momo:20201026125710p:plain

こんな感じで

この隙間を無くすcssの指定があります！

table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  border: 1px solid red;
  text-align: center;
}

こんなふうに、tableにborder-collapse:collapse;

と、border-spacing:0;とを指定します

border-collapse:collapse;は隣り合うセルのボーダーを重ねて表示する指定です

border-spacing:0;は隣り合うセルのボーダーとボーダーの間隔を指定します、

間隔は0にします

これをtableに指定することで

f:id:aki-momo:20201026125710p:plain

こうなります！！

参考になれば幸いです

ありがとうございました！

きままぶろぐ