沒有邊框的表格單元格有白線 - 我如何禁用它們？

我創建了這個表格，並將填充和邊框設置爲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>

（該表只是與更多的行重複。）

CSS代碼：

#jobtabelle tr { 
    height: 56px; 
    line-height: 56px; 
    border-top: 0; 
    border-bottom: solid 1px #424242; 
    overflow: hidden; 
    font-size: 16px; 

} 

#jobtabelle tbody tr:first-child { 
    background: #66bb6a; 
} 

#jobtabelle thead tr { 
    height: 25px; 
    line-height: 25px; 
    margin-top: 10px; 
} 

#jobtabelle td { 
    border-left: 0; 
    border-right: 0; 
    border-bottom: inherit; 
    padding: 0; 
    border-collapse: collapse; 
} 

#jobtabelle th:first-child +th +th +th, 
#jobtabelle th:first-child +th +th +th +th, 
#jobtabelle th:first-child +th +th +th +th +th, 
#jobtabelle th:first-child +th +th +th +th +th +th, 
#jobtabelle td:first-child +td +td +td, 
#jobtabelle td:first-child +td +td +td +td, 
#jobtabelle td:first-child +td +td +td +td +td, 
#jobtabelle td:first-child +td +td +td +td +td +td { 
    text-align: right; 
}

（I改變的<td>背景通過Safari爲灰色開發工具，所以線更容易看到）。

來源

2016-01-05 FeuerlordOhsai

[設置的cellpadding和CSS CELLSPACING？（可能的重複http://stackoverflow.com/questions/339923/set -cellpadding-and-cellspacing-in-css） – showdev

添加cellpadding="0"和cellspacing="0"您的餐桌：

<table id="jobtabelle" cellpadding="0" cellspacing="0">

或CSS：Set cellpadding and cellspacing in CSS?

演示：

#jobtabelle tr { 
 
    height: 56px; 
 
    line-height: 56px; 
 
    border-top: 0; 
 
    border-bottom: solid 1px #424242; 
 
    overflow: hidden; 
 
    font-size: 16px; 
 
} 
 
#jobtabelle tbody tr:first-child { 
 
    background: #66bb6a; 
 
} 
 
#jobtabelle thead tr { 
 
    height: 25px; 
 
    line-height: 25px; 
 
    margin-top: 10px; 
 
} 
 
#jobtabelle td { 
 
    border-left: 0; 
 
    border-right: 0; 
 
    border-bottom: inherit; 
 
    padding: 0; 
 
    border-collapse: collapse; 
 
} 
 
#jobtabelle th:first-child +th +th +th, 
 
#jobtabelle th:first-child +th +th +th +th, 
 
#jobtabelle th:first-child +th +th +th +th +th, 
 
#jobtabelle th:first-child +th +th +th +th +th +th, 
 
#jobtabelle td:first-child +td +td +td, 
 
#jobtabelle td:first-child +td +td +td +td, 
 
#jobtabelle td:first-child +td +td +td +td +td, 
 
#jobtabelle td:first-child +td +td +td +td +td +td { 
 
    text-align: right; 
 
}

<table id="jobtabelle" cellpadding="0" cellspacing="0"> 
 
    <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> 
 
    </tbody> 
 
</table>

來源

2016-01-05 18:36:58 CoderPi

嘖嘖嘖嘖嘖嘖嘖嘖嘖 –

非常感謝！我沒有想到細胞間隙。 – FeuerlordOhsai

歡迎您！你也可以在CSS中完成它：http://stackoverflow.com/questions/339923/set-cellpadding-and-cellspacing-in-css – CoderPi

的CSS屬性border-collapse添加到您的table。例如：

table#jobtable { 
    border-collapse: collapse; 
}

來源

2016-01-05 18:37:39

的border-collapse財產只是移到表本身

#jobtabelle { 
    border-collapse: collapse; 
}

來源

2016-01-05 18:40:17

沒有邊框的表格單元格有白線 - 我如何禁用它們？

回答

相關問題