html5表格大小问题
如图，“值班人员”处表格内容无法设置宽度相等
如果先设置了那里的宽度，下面“值班领导”部分会不相等
弄了半天，怎么也弄不好{:5_100:}
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
.Form
{
font-family: "微软雅黑";
font-size: 13px;
width: 400px;
height: 500px;
}
.tab1{
width:48px;
}
.tab{
border:solid 1px #dbdee1;
border-collapse: collapse;
word-break: break-all;
word-wrap: break-word;
overflow: hidden;
}
.tab td{
border:solid 1px #dbdee1;
text-align: center;
table-layout: fixed;
height:19px;
}
.thr{
width:64px;
height:20px;
}
</style>
</head>
<body>
<div class = "Form">
<table class="tab">
<tr>
<td></td>
<td colspan="6">值班组</td>
<td colspan="6">备勤组</td>
</tr>
<tr>
<tdclass="tab1">值班领导</td>
<td colspan="6">XXX</td>
<td colspan="6">XXX</td>
</tr>
<tr>
<tdclass="tab1">值班组长</td>
<td colspan="6">XXX</td>
<td colspan="6">XXX</td>
</tr>
<tr>
<td rowspan="6"class="tab1">值班人员</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
</tr>
<tr>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
</tr>
<tr>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
</tr>
<tr>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
</tr>
<tr>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
</tr>
<tr>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
<td class="sec" colspan="3">XXX</td>
</tr>
<tr>
<td rowspan="3">值班领导</td>
<td class="thr" colspan="4">XXX</td>
<td class="thr" colspan="4">XXX</td>
<td class="thr" colspan="4">XXX</td>
</tr>
<tr>
<td class="thr" colspan="4">XXX</td>
<td class="thr" colspan="4">XXX</td>
<td class="thr" colspan="4">XXX</td>
</tr>
<tr>
<td class="thr" colspan="4">XXX</td>
<td class="thr" colspan="4">XXX</td>
<td class="thr" colspan="4">XXX</td>
</tr>
<tr>
<td>驾驶员</td>
<td colspan="12">XXX</td>
</tr>
</table>
</div>
</body> <table class="tab"></table>在这里设置固定宽度，比如：width="400"这样，试试看 还有，你得把table-layout: fixed;这个属性设置到table，不能设置在td这边 1、请为tr下的第一个td，所有添加class：class="tab1"，鱼油有的项没有加。
2、为class="tab1"，设置宽度，鱼油写的是：
.tab1{
width:48px;
}
固定宽度写小了，手动改成55px，效果：
不二如是 发表于 2018-5-30 17:03
1、请为tr下的第一个td，所有添加class：class="tab1"，鱼油有的项没有加。
2、为class="tab1"，设置宽 ...
值班人员的值班组，备勤组单元格大小还是不一样{:5_99:} 在<td>标签中添加colspan属性，值为要横向合并的单元格数目 表格中内嵌表格也是个解决方案
页:
[1]