How to Create Tables in HTML? - Programmingempire

The following example code demonstrates How to Create Tables in HTML.

In order to create tables in HTML, we use the <table> tag. Within the <table> tag, we use <tr> tag to create a row. Whereas, the <td> tag is used to create a column. In order to create a cell that spans more than one column, we use the colspan attribute in the <td> tag. Similarly, we can use the rowspan attribute, if a cell spans for more than one row.

Example Code to Create Tables in HTML that Uses Rowspan and Colspan

In the following example, we create a table with a specified height and width using the height and width attributes respectively. Also, there is cellpadding attribute that indicates the distance between the cell content and the border of the cell.

<html>
  <head>
  <title>HTML Table</title>
  </head>
  <body>
     <div style="margin: 50px;">
     	<center><h1>HTML Table</h1>
        <table border="1" width="800" height="400" cellpadding="20" style="text-align: center;">
           <tr>
              <td colspan="2">Cell 1</td>
              <td>Cell 2</td>
              <td>Cell 3</td>
           </tr>
           <tr>
              <td rowspan="3">Cell 4</td>
              <td>Cell 5</td>
              <td>Cell 6</td>
              <td>Cell 7</td>
           </tr>
           <tr>
               <td colspan="3">Cell 8</td>
           </tr>
           <tr>
               <td>Cell 9</td>
               <td colspan="2">Cell 10</td>
           </tr>
        <table></center>
     </div>
   </body>
</html>

Output

Example Code to Create Tables in HTML that Uses Rowspan and Colspan

Further Reading