Complex Tables

The next HTML5 table example is about complex tables where merging data cells with rowspan and colspan that indicate number of rown or columns occupied by a cell.
Complex table example is shown hereL
	<!DOCTTYPE html> 
<!--Example: Complex Table.html -->
<html>
<head>
<title> This is a complex Table example </title>
</head>
<body>
<h1> Complex Table Example using colspan, rowspan, thead, th, tbody </h1>
<table border = "2">
<caption>Books Edited by Zoheir Ezziane </caption>
<thead>
<!-- colspans and rowspans merge cells horizontally or vertically -->
<!-- merging three rows -->
<th rowspan = "3" >
<img src = "Zoheir's book1.png" with = "300" height = "200" alt = "Advanced Quantum Systems Research">
</th>
<!-- merging five columns -->
<img src = "Zoheir's book2.png" with = "300" height = "200" alt = "Contemporary Research in Quantum Computing Systems">
</head>
<tbody>
<tr>
<th> Number of authors in the first book </th >
<td> 10 </td>
</tr>
<tr>
<th> Number of authors in the seond book </th >
<td> 13 </td>
</tr>
</tbody>
</table>
</body>
</html>

If the two pictures are available in the same folder where your HTML file is then the rendered complex table example is shown here:


For more details, please contact me here.
Date of last modification: 2020.