如何爲單個單元格單獨提供邊界間距0？

我有這樣一個表：如何爲單個單元格單獨提供邊界間距0？

<table> 
    <tr> 
    <td>11</td> 
    <td>12</td> 
    <td>13</td> 
    </tr> 
    <tr> 
    <td class="new">21</td> 
    <td>22</td> 
    <td>23</td> 
    </tr> 
</table>

的border-spacing爲表是2px這樣的：

table { 
    border-spacing: 2 2; 
}

欲細胞21和22作爲0之間的間距。所以我試過了：

table td.new { 
    border-spacing: 0 2; 
}

但是不起作用。請任何想法嗎？

來源

2014-11-04 Rey Rajesh

你CSS無效，應該是'border-spacing：2px 2px;'。但即使如此，我認爲它不會工作，因爲一般HTML表格的限制。也許合併單元格是一個選項（'colspan =「2」'）？ – Paul 2014-11-04 08:39:49

像素是不是一個問題..它仍然工作沒有PX ..我不想合併單元格..想知道一些工作，以實現沒有合併.. – 2014-11-04 08:43:11

邊界間距沒有像素爲值> = 0將不在Chrome afaik中呈現，但是很好。正如Hashem在他的回答中指出的那樣，這是不可能的。您只能使用'display：table-cell;'等方法嘗試使用div元素構建表格。 – Paul 2014-11-04 08:46:08

恐怕這是不可能的。

border-spacing和/或border-collapse性能僅適用於table s和inline-table s。因此，您無法爲特定單元覆蓋它。

如果你想這兩個單元格合併，則可以使用colspan

table{ 
 
    border-spacing: 2px 2px; 
 
    border: 1px solid; 
 
} 
 

 
td { 
 
    border: 1px solid gray; 
 
}

<table> 
 
    <tr> 
 
    <td>11</td> 
 
    <td>12</td> 
 
    <td>13</td> 
 
    </tr> 
 
    <tr> 
 
    <td colspan="2">21 22</td> 
 
    <td>23</td> 
 
    </tr> 
 
</table>

或者使用嵌套表格：

body > table { 
 
    border-spacing: 2px 2px; 
 
    border: 1px solid; 
 
} 
 

 
td { 
 
    border: 1px solid gray;; 
 
} 
 

 
table table { 
 
    border-spacing: 0; 
 
}

<table> 
 
    <tr> 
 
    <td>11</td> 
 
    <td>12</td> 
 
    <td>13</td> 
 
    </tr> 
 
    <tr> 
 
    <td colspan="2"> 
 
     <table> 
 
     <tr> 
 
      <td>21</td> 
 
      <td>22</td> 
 
     </tr> 
 
     </table> 
 
    </td> 
 
    <td>23</td> 
 
    </tr> 
 
</table>

來源

2014-11-04 08:41:38

是的..我得到你..但我想知道是否有工作要實現這個沒有合併單元格.. – 2014-11-04 08:44:51

@ReyRajesh嵌套表呢？ – 2014-11-04 08:47:55

這對我的要求適用..謝謝.. – 2014-11-04 08:49:39

如何爲單個單元格單獨提供邊界間距0？

回答

相關問題