您的位置:首页 > 其它

如何设置table的tbody高度,超出默认高度会出现滚动条!!!

2017-04-05 14:50 423 查看


需求:标题栏固定,tbody里的内容滑动;

  解决方案:用的是两个div内套了两个table,一个放thead,一个放thead,看起来像是一个table。padding-right:17px是指滚动条的宽度
 代码如下:
标题

<div  style="background:#EAEAEA;padding-right:17px">
<table class="footable foottable_tab">
<thead>
<tr bgcolor="#fafafa">
<th width="60">选择</th>
<th width="100">模板名称</th>
<th width="100">模板类型</th>
<th width="100">创建时间</th>
<th width="400">参数说明</th>
</tr>
</thead>
</table>
</div>
tbody部分
<div style="width:100%;height:200px;overflow:auto; border-bottom:1px solid #dddddd">
<table id="Template_listZ" class="footable foottable_tab" >
<tbody id="tplWrapper_TemplateZ">

<tr>
<td width="60" align="center"><input type="checkbox" id="checkbox" name="choose" value=""></td>

                        <td width="100" align="center">正常还款</td>
<td width="100" align="center">BatPro</td>
<td width="100" align="center">2016-09-26</td>
<td width="400" align="center">aaaaaaaaaa</td>
</tr>

<tr>
<td width="60" align="center"><input type="checkbox" id="checkbox" name="choose" value=""></td>
                        <td width="100" align="center">正常还款</td>
<td width="100" align="center">BatPro</td>
<td width="100" align="center">2016-09-26</td>
<td width="400" align="center">aaaaaaaaaa</td>
</tr>

<tr>
<td width="60" align="center"><input type="checkbox" id="checkbox" name="choose" value=""></td>
                        <td width="100" align="center">正常还款</td>
<td width="100" align="center">BatPro</td>
<td width="100" align="center">2016-09-26</td>
<td width="400" align="center">aaaaaaaaaa</td>
</tr>

</tbody>
</table>

</div>
结果如图
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: