HTML Table different number of columns in different rows

后端 未结 3 1946
你的背包
你的背包 2020-11-29 04:17

Like in Excel sheet can I have

  1. 2 columns in 1st row
  2. 1 long column in the 2nd row

is this possible in html ?

相关标签:
3条回答
  • 2020-11-29 04:48

    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>
    
    0 讨论(0)
  • 2020-11-29 04:50

    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.

    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).

    table {
      border: 1px solid #000;
      border-collapse: collapse;
    }
    
    th,
    td {
      border: 1px solid #000;
    }
    <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>

    0 讨论(0)
  • 2020-11-29 05:01

    yes, simply use colspan.

    0 讨论(0)
提交回复
热议问题