HTML表格不同行中的不同列数

Like in Excel sheet can I have

我可以在Excel表格中使用

2 columns in 1st row
第1行中的2列
1 long column in the 2nd row
第2行中有1列长列

is this possible in html ?

这有可能在HTML？

3 个解决方案

#1

On the realisation that you're unfamiliar with colspan, I presumed you're also unfamiliar with rowspan, so I thought I'd throw that in for free.

在意识到你对colspan不熟悉的时候，我认为你也不熟悉rowpan，所以我想我会把它扔进去。

One important point to note, when using rowspan: the following tr elements must contain fewer td elements, because of the cells using rowspan in the previous row (or previous rows).

需要注意的一点是，使用rowspan时：以下tr元素必须包含较少的td元素，因为单元格在前一行（或前一行）中使用了rowspan。

CSS:

CSS：

table {border: 1px solid #000; border-collapse: collapse; }
th, td {border: 1px solid #000; }

html:

HTML：

<table>
    <thead>
        <tr>
            <th colspan="2">Column one and two</th>
            <th>Column three</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td rowspan="2" colspan="2">A large cell</td>
            <td>a smaller cell</td>
        </tr>
        <tr>
            <!-- note that this row only has _one_ td, since the preceding row
                 takes up some of this row -->
            <td>Another small cell</td>
        </tr>
    </tbody>
</table>

Demo at: jsbin

演示：jsbin

#2

Colspan:

colspan属性：

<table>
   <tr>
      <td> Row 1 Col 1</td>
      <td> Row 1 Col 2</td>
</tr>
<tr>
      <td colspan=2> Row 2 Long Col</td>
</tr>
</table>

#3

yes, simply use colspan.

是的，只需使用colspan。

#1