table最终版IE（浏览器中宽度不起作用）
tbody{position:absolute;}
给table_div加边框
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="../main.css"/>
<title></title>
<style>
.main{width: 50%;float: left;height: 500px;padding: 10px;}
.table_div{width: 100%;float: left;overflow: auto;}
.table_div>.table_{table-layout:fixed;width: 100%;height:100%;position: relative;}
.table_div>.table_>thead{position: absolute;overflow: hidden;min-width: 100%;}
.table_div>.table_>thead>tr{background-color: #F2F2F2;}
.table_div>.table_>tbody{display: block;min-height:10px;position: absolute;}
.table_div>.table_>thead ~ tbody{height: calc(100% - 30px);margin-top: 30px;}
.table_ tr{display:inline-flex;line-height: 30px;min-width:100%}
.table_ th,.table_ td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:30px;float:left;font-weight: normal;text-align: left;text-indent: 7px;}
.table_ th,.table_ td{border-top: 1px solid #E6E6E6;border-left: 1px solid #E6E6E6;}
.table_ tbody>tr:last-of-type td{border-bottom: 1px solid #E6E6E6;}
.table_ tr th:last-of-type,.table_ tr td:last-of-type{border-right: 1px solid #E6E6E6;}
.fenye{width: 100%;height: 40px;float: left;background-color: #fff;}
.fenye>.fenye_xs{float: left;color: #999;line-height:40px;}
.fenye>.fenye_xs>span{color: #999;}
.fenye>.fenye_div{float: right;}
.fenye>.fenye_div>ul{float: right;border-radius: 5px;overflow: hidden;margin-top:2px}
.fenye>.fenye_div>ul>li{color: #999;padding:0 10px;line-height: 30px; float: right;text-align: center;}
.fenye>.fenye_div>ul>li:not(:last-of-type){cursor:pointer;}
.fenye>.fenye_div>ul>li:not(:last-of-type):hover{color:#3493E5;text-decoration: underline;}
.fenye>.fenye_div>ul>li>span{padding: 0 10px;}
.table_ th,.table_ td{width:120px;}
</style>
</head>
<body>
<div class="main">
<div class="table_div" style="height: calc(100% - 40px);">
<table class="table_">
<thead>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>电话</th>
<th>微信</th>
<th>QQ</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>电话</th>
<th>微信</th>
<th>QQ</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
<td>张三</td>
<td>男</td>
<td>22</td>
<td>18698598989</td>
<td>nizalaobuxign</td>
<td>2442851525</td>
</tr>
</tbody>
</table>
</div>
<div class="fenye">
<div class="fenye_xs">显示1-10，共<span>170</span>项</div>
<div class="fenye_div">
<ul>
<li>尾页</li>
<li>下一页</li>
<li>上一页</li>
<li>首页</li>
<li>第<span>1</span>/<span>10</span>页</li>
</ul>
</div>
</div>
</div>
</body>
</html>
浙公网安备 33010602011771号