关于作业的问题
来源:3-2 项目作业
Bighao啾啾啾
2019-08-16 15:30:00
老师,麻烦您帮我看看我作业里面关于单元格宽度的问题,怎么修改。ps:顺便帮忙看下还有没有别的问题
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>大作业</title>
<link rel="stylesheet" href="css/index.css">
</head>
<body>
<table>
<!--header部分-->
<thead>
<tr>
<td><img src="img/logo.png"></td>
</tr>
</thead>
<!--body部分-->
<tbody>
<tr>
<td>
<table>
<tr>
<td class="con1" valign="top">
<p style="margin-top: 20px;">商品管理</p>
<br>
<p>评价管理</p>
<br>
<p>咨询管理</p>
<br>
<h3 style="margin-top: 50px;">全部订单</h3>
<br>
<p>已完成订单</p>
<br>
<p>待处理订单</p>
<br>
<p>今日物流</p>
<br>
<p style="margin-top: 50px;">月考核</p>
<br>
<p>季度考核</p>
<br>
<p>年度考核</p>
</td>
<td class="con2">
<table class="con2-1">
<tr>
<td>全部订单</td>
</tr>
</table>
<table class="con2-2">
<tr>
<td>
<form action="index.html"><p>查询:<input type="date" name="date">至<input type="date" name="date"></p></form>
</td>
</tr>
</table>
<table class="con2-5">
<tr class="con2-3">
<td colspan="2" class="con2-3-1">宝贝信息</td>
<!-- <td>宝贝信息</td> -->
<td class="con2-3-2">订单数量</td>
<td class="con2-3-3">单价</td>
<td class="con2-3-4">买家</td>
<td class="con2-3-5">下单时间</td>
<td class="con2-3-6">实付款</td>
<td class="con2-3-7">订单操作</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/txue.png"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行文化衫</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">小明</td>
<td class="con2-3-5">2019-2-21 21:54</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">待付款</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/xie.jpg"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行运动鞋</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">小李子</td>
<td class="con2-3-5">2019-2-21 19:04</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/txue.png"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行文化衫</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">小红</td>
<td class="con2-3-5">2019-2-21 16:54</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">待发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/xie.jpg"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行运动鞋</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">可乐</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/txue.png"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行文化衫</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">魏明</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/xie.jpg"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行运动鞋</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">李晓雨</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/txue.png"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行文化衫</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">艳艳</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/xie.jpg"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行运动鞋</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">片片</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/txue.png"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行文化衫</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">小兰</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/xie.jpg"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行运动鞋</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">魏璎珞</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/txue.png"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行文化衫</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">小慕</td>
<td class="con2-3-4">120</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
<tr class="con2-4">
<td class="img"><img src="img/txue.png"></td>
<td class="con2-4-1">2019年个性男女潮牌imooc暮春之行文化衫</td>
<td class="con2-3-2">2</td>
<td class="con2-3-3">120</td>
<td class="con2-3-4">小苏</td>
<td class="con2-3-5">2019-2-21 14:30</td>
<td class="con2-3-6">240</td>
<td class="con2-3-7">未发货</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</tbody>
<!--footer部分-->
<tfoot>
<tr>
<td>2019-9-21-© imooc.com</td>
</tr>
</tfoot>
</table>
</body>
</html>
/*All Tag*/
*{
padding:0;
margin:0;
}
/*header部分*/
table{
width: 100%;
border: 1px solid #eee;
border-collapse: collapse;
}
thead{
background: #169bd5;
}
thead > img{
height: 50px;
line-height: 50px;
}
/*section部分*/
tbody{
width: 100%;
}
.con1{
width:12%;
border:2px solid #ccc;
}
.con2{
width:88%;
border:2px solid #ccc;
}
.con2-1,.con2-2{
width:100%;
height: 50px;
}
.con2-5{
width: 100%;
}
.con2-5 td{
border: 1px solid #CCCCCC;
text-align: center;
}
.con2-3{
width: 1000px;
height: 50px;
}
.con2-4{
width: 1000px;
height: 54px;
}
.con2-3-1{
width: 400px;
height: 50px;
}
.con2-4 .img img{
height: 54px;
}
.con2-4 .con2-4-1{
width:300px;
height: 54px;
}
.con2-3-2{
width: 100px;
height: 50px;
}
.con2-3-3{
width: 60px;
height: 50px;
}
.con2-3-4{
width: 80px;
height: 50px;
}
.con2-3-5{
width: 180px;
height: 50px;
}
.con2-3-6{
width: 80px;
height: 50px;
}
.con2-3-7{
width: 100px;
height: 50px;
}
/*footer部分*/
tfoot{
width: 100%;
background: #169bd5;
height: 60px;
text-align: center;
line-height: 60px;
}
1回答
好帮手慕言
2019-08-16
同学你好,有些元素的宽高可以不用设置,让内容撑开就好了
同学完成作业之后,可以提交作业,批复作业的老师会根据作业的问题作出针对性的辅导。
如果帮助到了你,欢迎采纳~祝学习愉快~
相似问题