HTML Table

HTML table tag is used to display data in tabular form. There will be many columns in a single row. We can create a table to display data in tabular form using <table> element with the help of <tr>, <td>, and <th> elements.

The table row is defined by <tr> tag, table header is defined by <th>, and table data is defined by <td> tags.

HTML Table Tags

HTML Table with Border

You can use border attribute of table tag in HTML to specify border.

<table border="1"></table>  

You can use border property of CSS to specify border in table.

<style>  
  table, th, td {  
    border: 1px solid black;  
  }  
</style>  

HTML Table with Width

We can specify width using css width property, It can be specify in pixels or percentage.

table {  
   width: 100%;   
}

HTML Table with Colspan

If you want to make a cell span more than one column, you can use the colspan attribute.

<table style="width:100%">  
    <tr>  
        <th>Name</th>  
        <th colspan="2">Mob Number</th>  
    </tr>  
    <tr>  
        <td>Jacob Wiliom</td>  
        <td>9733446688</td>  
        <td>8244882278</td>  
    </tr>  
</table> 

HTML Table with Rowspan

If you want to make a cell span more than one row you can use the rowspan attribute. It will divide a cell into multiple rows. The number of divided rows will depend on rowspan values.

<table>
    <tr>
        <th>Name</th>
        <td>Jacob Wiliom</td>
    </tr>    
    <tr>
        <th rowspan="2">Mob Number</th>
        <td>9733446688</td>
    </tr>    
    <tr>
        <td>8244882278</td>
    </tr>
</table>