HTML_后台框架全屏界面_简易table形式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
html, body {
width:100%;
height:100%;
padding: 0;
margin: 0;
overflow: hidden;
background-color: #f3f3f3;
font-family: "Hiragino Sans GB",\5FAE\8F6F\96C5\9ED1,Tohoma;;
}
.index-wrap{
min-width: 960px;
height: 100%;
}
.index-table{
height: 100%;
width: 100%;
table-layout: fixed;
}
.index-table td, th, div {
word-break: break-all;
word-wrap: break-word;
}
.index-table th {
width: 140px;
}
.index-table .head {
height: 80px;
}
</style>
</head>
<body>
<div class="index-wrap">
<table class="index-table" border="1">
<tr class="head">
<th>logo</th>
<td>nav</td>
</tr>
<tr class="mian">
<th>bar</th>
<td>content</td>
</tr>
</table>
</div>
</body>
</html>
效果图如下
无需任何JS代码,再也不用ready/resize调整,