Html 无边框的表格单元格有白线-如何禁用它们？

我创建了这个表，并将填充和边框设置为0。但是细胞周围有奇怪的白线。这是什么？如何禁用它们

HTML代码：

    <table id="jobtabelle">
  <thead>
    <tr>
      <th>
        <button id="addbutton" class="left"><i class="material-icons">add</i></button>
      </th>
      <th></th>
      <th>Job</th>
      <th>Länge/mm</th>
      <th>Gesamt/QTY</th>
      <th>Rest/QTY</th>
      <th>Fertig um</th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <td></td>
      <td>Job1</td>
      <td>800.000</td>
      <td>50</td>
      <td>20</td>
      <td>14:40</td>
      <td>
        <button id="" class="left"><i class="material-icons">more_horiz</i></button>
      </td>
    </tr>
    <tr>

（我通过Safari开发工具将

的背景更改为灰色，这样线条更容易看到。）

将

cellpadding=“0”

和

cellspacing=“0”

添加到您的表格中：

或在CSS中：

演示：

#jobtabelle tr{
高度：56px；
线高：56px；
边界顶部：0；
边框底部：实心1px#4242；
溢出：隐藏；
字体大小：16px；
}
#jobtabelle tbody tr：第一个孩子{
背景#66bb6a；
}
#jobtabelle thead tr{
高度：25px；
线高：25px；
边缘顶部：10px；
}
#jobtabelle td{
左边框：0；
右边界：0；
边框底部：继承；
填充：0；
边界塌陷：塌陷；
}
#jobtabelle th:第一个孩子+th+th+th，
#jobtabelle th:第一个孩子+th+th+th+th，
#jobtabelle th:第一个孩子+th+th+th+th+th，
#jobtabelle th：第一个孩子+th+th+th+th+th+th，
#jobtabelle td:first child+td+td+td，
#jobtabelle td：第一个孩子+td+td+td+td+td，
#jobtabelle td:first child+td+td+td+td+td，
#jobtabelle td:第一个孩子+td+td+td+td+td+td+td+td{
文本对齐：右对齐；
}

添加
工作
朗热/毫米
金额/数量
剩余/数量
蕨类植物
工作1
800
50
20
14:40
更多霍里兹

将CSS属性

边框折叠

添加到

表中

。例如：

table#jobtable {
    border-collapse: collapse;
}

---

只需将

边框折叠

属性移动到表本身

#jobtabelle {
   border-collapse: collapse;
}

---

欢迎光临！您还可以在CSS中执行此操作：可能重复