The colspan Attribute in HTML is simply to define how many numbers of columns a cell should take/span in a table. Basically using
colspan attribute in HTML tables you are merging the multiple cells.
AS MDN docs say: The default value of
colspan is 1 and the value must be in non-negative integer. The limitation of the value is 1000. And the value above 1000 will be considered as incorrect value and will be set to the default value 1.
But the tag really doesn’t care about the maximum limit of value because I tried the insane value of
10000000000000000000000000 and it worked well, It doesn’t change to the default value 1 in chrome version 78.0.3904.97 (Official Build) (64-bit) I don’t know about other browsers may be the limits exists in other or old version of browsers.
You can use colspan attribute in HTML with
<th> tags. For example below:-
<table> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$100</td> </tr> <tr> <td colspan="2">Sum: $180</td> </tr> </table>
In the above example the last row
td tag will take both of month and savings columns because we defined the
colspan attribute and set the value
2. If you want to cover 3 columns set the value as
4 for 4 columns and so on.
<table> <tr> <th colspan="2">Monthly Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </table>
In the above example of
th tag the Monthly Savings heading will expand in 2 cells of the table and everything will be remain the same.
some of the information is collected from the mdn.