HTML Table Colspan & Rowspan
HTML tables can have cells that spans over multiple rows and/or columns.
colspan is used to merge 2 or more cells horizontally. And rowspan is used to merge 2 or more cells vertically.
HTML tables can have cells that spans over multiple rows and/or columns.
colspan is used to merge 2 or more cells horizontally. And rowspan is used to merge 2 or more cells vertically.
To make a cell span over multiple columns, use the colspan attribute:
<table>
<tr>
<th>srn</th>
<td colspan="2">1</td>
</tr>
<tr>
<th>Name</th>
<td>Alfreds</td>
<td>Devid</td>
</tr>
<tr>
<th>Address</th>
<td>USA</td>
<td>Japan</td>
</tr>
</table>
srn | 1 | |
---|---|---|
Name | Alfreds | Devid |
Address | USA | Japan |
To make a cell span over multiple rows, use the rowspan attribute:
<table>
<tr>
<th>Company</th>
<th>Contact</th>
<th rowspan="2">Country</th>
</tr>
<tr>
<th>Alfreds Futterkiste</th>
<th>Maria Anders</th>
<th>Germany</th>
</tr>
<tr>
<th>Centro comercial Moctezuma</th>
<th>Francisco Chang</th>
</tr>
</table>
Company | Contact | Country |
---|---|---|
Alfreds Futterkiste | Maria Anders | Germany |
Centro comercial Moctezuma | Francisco Chang |
In this page (written and validated by A. Gawali) you learned about HTML Table colspan and rowspan . What's Next? If you are interested in completing HTML tutorial, your next topic will be learning about: HTML Table styling.
Share On: |