刪除HTML表格行和列之間的間距

Question

我正在創建一個表格，我希望其中的元素在邊界處連接（根本沒有間距）。 但是，行和列之間似乎有一個很小的間隙，我無法刪除。

這是html的外觀： https : //jsfiddle.net/sy2h8t9c/我已將cellpacing，border-spacing和cellpadding設置為0。

HTML：

<table>
  <tr>
    <th><div></div></th>
    <th><div></div></th>
  </tr>
  <tr>
    <th><div></div></th>
    <th><div></div></th>
  </tr>
  <tr>
    <th><div></div></th>
    <th><div></div></th>
  </tr>
  <tr>
    <td><div></div></td>
    <td><div></div></td>
  </tr>
</table>

CSS：

table, th, td {
  border: none;
  margin:0px;
  cellspacing:0px;
  border-spacing:0px;
  cell-padding:0px;
}
div{
  width:5px;
  height:5px;
  background-color:black;
  display:block;
}

當前結果在jsfiddle中提供。 我正在嘗試使其看起來像一個純黑框。 感謝您的幫助。

Answer 1

添加padding: 0; 到你的代碼

table, th, td {
  border: none;
  margin:0px;
  padding: 0;
  cellspacing:0px;
  border-spacing:0px;
  cell-padding:0px;
}

Answer 2

 cellspacing:0px; 

刪除它。 曾經有一個名為HTML屬性cellspacing ，但它是由CSS二十年前廢棄。

 cell-padding:0px; 

該屬性稱為padding 。 它沒有用於表的特殊版本。 （曾經有一個名為cellpadding的HTML屬性，但是同樣，CSS在90年代問世，不再需要了）。

 table, th, td { border: none; margin: 0px; padding: 0; border-spacing: 0px; } div { width: 5px; height: 5px; background-color: black; display: block; } 

 <table> <tr> <th> <div></div> </th> <th> <div></div> </th> </tr> <tr> <th> <div></div> </th> <th> <div></div> </th> </tr> <tr> <th> <div></div> </th> <th> <div></div> </th> </tr> <tr> <td> <div></div> </td> <td> <div></div> </td> </tr> </table>