HTML表格colspan rowspan

Question

我有6列＆amp;我想将colspan用于3＆amp; 4和5＆amp; 6列。 而且我不想展示第一和第一该特定行的第二列。

如何隐藏该行中的1＆amp; 2列？

期望的输出..

Answer 1

从您希望的单元格中删除边框＆＃34;隐藏＆＃34;。他们仍在那里，但在视觉上缺席。

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

在1号和1号文件的CSS文件中使用display:none;第二栏。

您可以选择：

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;
}