html - 如何扩大表格列之间的间隔？ CSS表

我有一个有两列的简单表，我想扩大两列之间的差距。我试过column gap属性，但没有成功。我怎样才能扩大差距？
JSFiddle

      #t td {
        -webkit-column-gap: 40px;
        -moz-column-gap: 40px;
        column-gap: 40px;
      }
      #t tr:hover {
        background-color: #00FF00;
      }
      #t tr:first-child {
        font-weight: bold;
      }

<table id="t">
  <tr>
    <td>Column1</td>
    <td>Column2</td>
  </tr>
  <tr>
    <td>1000</td>
    <td>2000</td>
  </tr>
</table>

最佳答案

您可以使用pseudoAJ的答案中所示的边框间距。但问题是，如果设置垂直边框间距，则在表的左/右端会有一个空格。
因此，更好的选择是使用边框大小。
例如，为第一列设置border-left: 100px solid #FFF;并设置border:0px。

tr:hover {
   background-color: #00FF00;
 }
 tr:first-child {
   font-weight: bold;
 }

td,th{
  border-left: 100px solid #FFF;
}

 tr>td:first-child {
   border:0px;
 }

<table id="t">
  <tr>
    <td>Column1</td>
    <td>Column2</td>
  </tr>
  <tr>
    <td>1000</td>
    <td>2000</td>
  </tr>
</table>

关于html - 如何扩大表格列之间的间隔？ CSS表，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/37571500/