Splitting and merging table in HTML (colSpan, rowspan)

Time:2021-7-29

Code demonstration horizontal merge:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        < title > demo table tag 2 -- cell merging < / Title >
        <style type="text/css">
            td{
                text-align: center;
            }
        </style>
    </head>
    <body>
        <table border="1" cellspacing="0" width="50%" height="150">
            < caption > merge cells horizontally < / caption >
<!-- ColSpan must specify the number of columns to merge, two or three columns, etc. -- >        
            < tr > < th colSpan = "2" > name and age < / th > < th > phone < / th > < / TR >
            <tr> <td>Jack</td> <td>24</td> <td>1351234567</td>  </tr>
            <tr> <td>Tom</td> <td>22</td> <td>1351234567</td>  </tr>
            <tr> <td>Rose</td> <td>22</td> <td>1351234567</td>  </tr>
            < tr > < td > Zhang San < / td > < td > 25 < / td > < td > 1351234567 < / td > < / TR >
        </table>
        <br/>

        <table border="1" cellspacing="0" width="50%" height="150">

Operation results:

这里写图片描述

Code demonstration vertical merge:

<table border="1" cellspacing="0" width="50%" height="150">
            < caption > merge cells vertically < / caption >
            < tr > < th > class < / T > < th > name < / th > < th > age < / th > < th > telephone < / th > < / TR >
            < tr > < TD rowspan = "2" > shift 601 < / td > < td > Jack < / td > < td > 24 < / td > < td > 1351234567 < / td > < / TR >
            <tr> <td>Tom</td> <td>22</td> <td>1351234567</td>  </tr>
<!-- The rowspan must specify the number of columns to merge, two or three rows, etc. -- >    
            < tr > < TD rowspan = "3" > class 602 < / td > < td > rose < / td > < td > 22 < / td > < td > 1351234567 < / td > < / TR >
            < tr > < td > Zhang San < / td > < td > 25 < / td > < td > 1351234567 < / td > < / TR >
            < tr > < td > Li Si < / td > < td > 25 < / td > < td > 1351234567 < / td > < / TR >
        </table>
    </body>
</html>

Operation results:

这里写图片描述

This is the end of this article about table table splitting and merging (colSpan and rowspan) in HTML. For more information about table splitting and merging, please search previous articles of developeppaer or continue to browse the relevant articles below. I hope you will support developeppaer in the future!

Recommended Today

VBS obtains the operating system and its version number

VBS obtains the operating system and its version number ? 1 2 3 4 5 6 7 8 9 10 11 12 ‘************************************** ‘*by r05e ‘* operating system and its version number ‘************************************** strComputer = “.” Set objWMIService = GetObject(“winmgmts:” _  & “{impersonationLevel=impersonate}!\\” & strComputer & “\root\cimv2”) Set colOperatingSystems = objWMIService.ExecQuery _  (“Select * from […]