Home > Article > Web Front-end > HTML表格制作问题_html/css_WEB-ITnose
HTML表格制作问题_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:14:581040browse
如图，如何在同一个table里有两行，让上下两行单元格宽度不同
回复讨论(解决方案)
table 有 colspan 和 rowspan 属性 加到td标签上
colspan 纵向合并
rowspan 横向合并
比如下面就是表格单元横跨两行的表格 纵向的用法一样
<table> <tr> <td rowspan='2'>内容</td> </tr> <tr> <td>内容</td> <td>内容</td> </tr> </table>
table 有 colspan 和 rowspan 属性 加到td标签上
colspan 纵向合并
rowspan 横向合并
比如下面就是表格单元横跨两行的表格 纵向的用法一样
<table> <tr> <td rowspan='2'>内容</td> </tr> <tr> <td>内容</td> <td>内容</td> </tr> </table>
上下两行单元格宽度不一样，但是同一个表中一旦改变一个都会一起变化 ，我想让上下宽度不一样，就像“享受低保”的宽度不和“姓名”一样，怎么实现？
<table class="table1" cellspacing="1" cellpadding="0" width="100%" align="center"> <td class="td2" rowspan=7 width=105>关爱工作情况</td> <!-- 第一行--> <td class="td2" rowspan=3 width=125>干部"一对一联系帮扶情况"</td> <tr> <td class="td2">姓名</td> <td class="td2">性别</td> <td class="td2" colspan=2>单位</td> <td class="td2" colspan=2>职务</td> <td class="td2" colspan=3>联系电话</td> </tr> <tr> <td class="td2"><input type="textfield" style="width:94%; height:100%;border:0;"></td> <td class="td2"> <select style="width:98%; height:100%;border:0;"> <option value="man" selected=“selected”>男</option> <option value="woman">女</option> </select> </td> <td class="td2" colspan=2><input type="textfield" style="width:95%; height:100%;border:0;"></td> <td class="td2" colspan=2><input type="textfield" style="width:97%; height:100%;border:0;"></td> <td class="td2" colspan=4><input type="textfield" style="width:97%; height:100%;border:0;"></td> </tr> <td class="td2" rowspan=3>救助情况</td> <tr> <td width=150 class="td2">享受低保</td> <td width=150 class="td2">临时救助</td> <td width=150 class="td2">医疗救助</td> <td width=150 class="td2">住房救助</td> <td width=150 class="td2">入住养老机构</td> <td class="td2" colspan=3>其他救助</td> </tr> <tr> <td class="td3"><input type="textfield" style="width:94%; height:100%;border:0;"></td> <td class="td3"><input type="textfield" style="width:94%; height:100%;border:0;"></td> <td class="td3"><input type="textfield" style="width:94%; height:100%;border:0;"></td> <td class="td3"><input type="textfield" style="width:94%; height:100%;border:0;"></td> <td class="td3"><input type="textfield" style="width:94%; height:100%;border:0;"></td> <td class="td3" colspan=3><input type="textfield" style="width:99; height:100%;border:0;"></td> </tr></table>
求助啊 怎么解决==
你这个要求智能累自己，要做到上下两个各自不一样大这个需要把一张打的table表，切割成很小很小的单元。
然后通过td标签的 colspan属性将相邻的多个单元格拼接在一起。
上面是你要的姓名，下面是享受低保。。。
不过，只要你用到表格，填写的时候都会因为字符长度影响到格子大小的。
你这个要求智能累自己，要做到上下两个各自不一样大这个需要把一张打的table表，切割成很小很小的单元。
然后通过td标签的 colspan属性将相邻的多个单元格拼接在一起。
上面是你要的姓名，下面是享受低保。。。
不过，只要你用到表格，填写的时候都会因为字符长度影响到格子大小的。
如果这个对你有帮助请点击，我的小尾巴。。。。 http://www.virtureworld.com谢谢
只能说要求就是这样的 ，一模一样的。我后来在行里又嵌套了一个table==既可以调节宽度了
你这个要求智能累自己，要做到上下两个各自不一样大这个需要把一张打的table表，切割成很小很小的单元。
然后通过td标签的 colspan属性将相邻的多个单元格拼接在一起。
上面是你要的姓名，下面是享受低保。。。
不过，只要你用到表格，填写的时候都会因为字符长度影响到格子大小的。
如果这个对你有帮助请点击，我的小尾巴。。。。 http://www.virtureworld.com谢谢
只能说要求就是这样的 ，一模一样的。我后来在行里又嵌套了一个table==既可以调节宽度了
这是一种方法，不过这个在线填表的话不会受到字符长度影响吗？
你这个要求智能累自己，要做到上下两个各自不一样大这个需要把一张打的table表，切割成很小很小的单元。
然后通过td标签的 colspan属性将相邻的多个单元格拼接在一起。
上面是你要的姓名，下面是享受低保。。。
不过，只要你用到表格，填写的时候都会因为字符长度影响到格子大小的。
如果这个对你有帮助请点击，我的小尾巴。。。。 http://www.virtureworld.com谢谢
只能说要求就是这样的 ，一模一样的。我后来在行里又嵌套了一个table==既可以调节宽度了
这是一种方法，不过这个在线填表的话不会受到字符长度影响吗？
不知道哎，我们同事说可以嵌套一个table 然后我就试着这么做了