为什么高度没有被内容撑开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>慕课网</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<table class="all">
<thead>
<tr><td><img src="img/logo.png"></td></tr>
</thead>
<tfoot>
<tr><td>2019-9-21 ©copyimooc.com</td></tr>
</tfoot>
<tbody>
<tr><td>
<table class="aside">
<tr>
<td>
<p>商品管理</p></br>
<p>评价管理</p></br>
<p>咨询管理</p></br></br>
<p>全部订单</p></br>
<p>已完成订单</p></br>
<p>待处理订单</p></br>
<p>今日物流</p></br></br>
<p>月考核</p></br>
<p>季度考核</p></br>
<p>年度考核</p></br>
</td>
<td>
<table class="allform">
<tr>
<td>全部订单</td>
</tr>
</table>
<table class="check">
<tr>
<td>查询：<input type="date">至<input type="date"></td>
</tr>
</table>
<table class="form">
<tr>
<td colspan="2">宝贝信息</td>
<td>订单数量</td>
<td>单价</td>
<td>买家</td>
<td>下单时间</td>
<td>实付款</td>
<td>订单操作</td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img src="img/txue.png"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</td>
</tr>
</table>
</td></tr>
</tbody>
</table>
</body>
</html>
CSS部分：
*{
margin: 0;
padding: 0;
}
.all{
width: 100%;
}
.all > thead > tr > td {
width: 100%;
height: 60px;
background: #169BD5;
position: relative;
}
.all > tfoot > tr > td {
width: 100%;
height: 60px;
background: #169BD5;
text-align: center;
margin: 0 auto;
}
table {
border: 1px solid #ccc;
border-collapse: collapse;
}
.aside{
width: 100%;
}
.aside > tbody > tr > td:first-of-type {
width: 12%;
padding-top: 20px;
padding-left: 10px;
border:1px solid #ccc;
}
.aside > tbody > tr > td:last-of-type {
width: 88%;
border:1px solid #ccc;
}
.allform{
width: 100%;
height: 50px;
position: absolute;
top: 60px;
}
.allform > tbody > tr > td {
padding-left: 10px;
}
.check{
width: 100%;
height: 50px;
position: absolute;
top: 110px;
}
.check > tbody > tr > td {
padding-left: 10px;
}
.form{
width: 100%;
height: 50px;
position: absolute;
top: 160px;
text-align: center;
}
.form > tbody >tr > td {
line-height: 50px;
border:1px solid #ccc;
}
.form > tbody >tr > td > img {
height: 54px;
width: 50px;
}
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星