風格行或列而不是單元格時邊框合攏：單獨

Question

我有一個表，其他原因，我寧願保持table-collapse：單獨。但是，我希望能夠突出顯示單個行或列。不幸的是，似乎適用於<tr>或<col>標籤的任何樣式僅適用於單元格，而不適用於它們之間的空格。例如：

<style> 
    td { width: 10px; height: 10px; } 
</style> 
<table style="background-color: purple"> 
    <colgroup> 
    <col span="2"> 
    <col style="background-color: red;"> 
    <col span="2"> 
    <colgroup> 
    <tr><td><td><td><td><td></tr> 
    <tr><td><td><td><td><td></tr> 
    <tr style="background-color: orange;"><td><td><td><td><td></tr> 
    <tr><td><td><td><td><td></tr> 
    <tr><td><td><td><td><td></tr> 
</table> 

導致紫色表5個垂直細胞和5個填充有顏色水平細胞而不是整個行或列。

除了使用border-collapse之外，我還有其他選擇：摺疊以填充給定行或列中單元格之間的空間嗎？

Answer 1

如果使用固定行寬，則可以使用colspan將某行的所有單元格合併到一個單元格中，然後使用您選擇的背景顏色爲單獨的邊框創建一個新表格。

Answer 2

不與border-collapse: separate，該W3C specifications張祖興它到底：

注意，如果表中有「邊界崩潰：獨立」，由「邊界間距」給出的區域的背景屬性始終表格元素的背景。請參閱separated borders model。

和：

在[邊框間距]空間，行，列，行組和列組的背景是不可見的，從而允許表背景顯現出來。行，列，行組和列組不能有邊框（即用戶代理必須忽略這些元素的邊框屬性）。

您可能要檢查表CSS瀏覽器兼容性：

• Table CSS properties
• Table column CSS properties

Answer 3

table-collapse: separate與CELLSPACING還挺吮吸這個原因。您可能會更好地摺疊邊框並手動填充CSS中的單個單元格。