简体   繁体   English

HTML colspan和rowspan问题

[英]HTML colspan and rowspan issue

I have an issue with HTML colspan & rowspan , I want to merge the first column (name) and last column (telephone) but it gave me unwanted result. 我在HTML colspanrowspan遇到问题,我想合并第一列(名称)和最后一列(电话),但这给了我不想要的结果。 Here's what I want as result: 结果就是我想要的:

在此处输入图片说明

Here what I got: 这是我得到的:

在此处输入图片说明

My code: 我的代码:

 <table> <tr> <th colspan="3">Name</th> <th rowspan="2">Age</th> <th colspan="2">Telephone</th> </tr> <tr> <th>First name</th> <th>Middle name</th> <th>Last name</th> </tr> <tr> <th>pre</th> <th>post</th> </tr> <tr> <td>Jill</td> <td>David</td> <td>Smith</td> <td>50</td> <td>055</td> <td>5778541</td> </tr> <tr> <td>Roben</td> <td>Jill</td> <td>Adam</td> <td>35</td> <td>050</td> <td>5577854</td> </tr> </table> 

change rowspan to colspan and fix the colspan's value rowspan更改为colspan并固定colspan的值

 <table border=1> <tr> <th colspan="3">Name</th> <th colspan="1">Age</th> <th colspan="2">Telephone</th> </tr> <tr> <th>First name</th> <th>Middle name</th> <th>Last name</th> <th></th> <th>pre</th> <th>post</th> </tr> <tr> <td>Jill</td> <td>David</td> <td>Smith</td> <td>50</td> <td>055</td> <td>5778541</td> </tr> <tr> <td>Roben</td> <td>Jill</td> <td>Adam</td> <td>35</td> <td>050</td> <td>5577854</td> </tr> </table> 

From the second row you have to fill all coloms. 在第二行中,您必须填充所有列。

 <table> <tr> <th colspan="3">Name</th> <th rowspan="1">Age</th> <th colspan="2">Telephone</th> </tr> <tr> <th>First name</th> <th>Middle name</th> <th>Last name</th> <th></th> <th>pre</th> <th>post</th> </tr> <tr> <td>Jill</td> <td>David</td> <td>Smith</td> <td>50</td> <td>055</td> <td>5778541</td> </tr> <tr> <td>Roben</td> <td>Jill</td> <td>Adam</td> <td>35</td> <td>050</td> <td>5577854</td> </tr> </table> 

Just Add 4 empty Heading Tag Before Pre&post like this code: 只需在Pre&post之前添加4个空白的标题标签,就像这样的代码:

<table>
            <tr> 
                <th colspan="3">Name</th>
                <th rowspan="2">Age</th>
                <th colspan="2">Telephone</th>
            </tr>
            <tr>
                <th>First name</th>
                <th>Middle name</th>
                <th>Last name</th>
            </tr>
            <tr>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th>pre</th>
                <th>post</th>
            </tr>
            <tr> 
                <td>Jill</td>
                <td>David</td>
                <td>Smith</td> 
                <td>50</td>
                <td>055</td>
                <td>5778541</td>  
            </tr> 
            <tr> 
                <td>Roben</td>
                <td>Jill</td> 
                <td>Adam</td> 
                <td>35</td>
                <td>050</td>
                <td>5577854</td>
            </tr>
        </table>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM