表格行背景顏色未填充整行

Question

我有一個簡單的表，該表的頂部一行有一個td元素，下面的表有3 td這里是結構：

<tr class="type">
  <td>
    <span>Platform</span>
  </td>
</tr>
<tr class="type__el">
  <td>OS</td>
  <td class="value">WINDOWS</td>
  <td class="score"> 8.6</td>
</tr>

所以我試圖設置第一行的背景顏色，但是它不能正常工作，它只會突出顯示文本：

.type {
 background-color : #ccc;
}

我已經嘗試將3 td添加到該行中，並且它可以正常工作，但由於我看到它們之間的這些間隙而不能清理干凈：

Answer 1

您可以使用屬性colspan="3"在第一行中使用<td>

結果

 .type { background-color: #ccc; } 

 <table> <tr class="type" bgcolor="red"> <td colspan="3"> <span>Platform</span> </td> </tr> <tr class="type__el"> <td>OS</td> <td class="value">WINDOWS</td> <td class="score"> 8.6</td> </tr> </table> 

Answer 2

您必須使用colspan屬性，值3應該起作用

 .type { background-color : #ccc; } 

 <table> <tbody> <tr class="type" bgcolor="red"> <td colspan="3"> <span>Platform</span> </td> </tr> <tr class="type__el"> <td>OS</td> <td class="value">WINDOWS</td> <td class="score"> 8.6</td> </tr> </tbody> </table> 

您可以在此問題上了解更多信息