HTML表列跨度rowspan的

Question

我有6列&我想使用 4和5 & 6列。 而我不想爲該特定行顯示第一列&第二列。

如何隱藏1 &該行中的2列？

所需的輸出..

Answer 1

刪除您希望「隱藏」的單元格的邊框。他們仍然在那裏，但視覺缺席。

Have a fiddle!

Experimental fiddle爲table { border: xxx; }修復。

在這個例子中，我的目標是tbody tr:first-child td:first-child。這顯然也可以用class作爲目標。

HTML

<table> 
    <tbody> 
     <tr> 
      <td colspan="2"></td> 
      <td colspan="2"></td> 
      <td colspan="2"></td> 
     </tr> 
     <tr> 
      <td></td> 
      <td></td> 
      <td></td> 
      <td></td> 
      <td></td> 
      <td></td> 
     </tr> 
    </tbody> 
</table> 

CSS

table { 
    border-collapse: collapse; 
    width: 500px; 
} 
td { 
    border: solid 1px #000; 
    padding: 10px; 
} 
tbody tr:first-child td:first-child { 
    border: none; 
} 

Answer 2

使用display:none;在一號&二縱你的CSS文件。

你可以選擇它們：

td:nth-of-type(1), 
td:nth-of-type(2) { 
    display:none; 
} 

Answer 3

使用該行的前兩列visibility:hidden。

Answer 4

嘗試爲該單元格使用visibility: hidden; empty-cells: hide;。

Answer 5

Here is a fiddle

HTML

<table border="1"> 
    <thead> 
     <tr> 
      <td colspan="2" style="border: 0;">a1</td> 
      <td colspan="2">a3</td> 
      <td colspan="2">a5</td> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>1</td> 
      <td>2</td> 
      <td>3</td> 
      <td>4</td> 
      <td>5</td> 
      <td>5555</td> 
     </tr> 
    </tbody> 
</table> 

CSS

table { 
    border: none; 
    border-collapse: collapse; 
}