老师，我想问下，我这个布局为啥加CSS不显示，布局对吗？为啥tbody会在table里面。
来源：3-2 项目作业
冯俊松
2020-06-25 22:58:33
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单</title>
<style type="text/css">
*{
padding: 0;
margin: 0;
font-family:"Arial";
font-size: 16px;
}
.table{
width: 100%;
height: 100%;
}
.head{
display: block;
width:100%;
height: 60px;
background: #169bd5;
border:none;
}
.head>td >img{
margin-top:5px;
height: 40px;
display: block;
}
.main table{
width: 100%;
}
.main table>tr>.aside{
width:12%;
background: red;
}
</style>
</head>
<body>
<table class="table">
<thead>
<tr class="head"><td><img src="img/logo.png"></td></tr>
</thead>
<tfoot></tfoot>
<tbody class="main">
<table>
<tr>
<td class="aside">
<p>商品管理</p><p>评价管理<p>咨询管理</p><br></p>
<h3>全部订单</h3><p>已完成订单</p><p>待处理订单</p><p>今日物流</p><br>
<p>日考核</p><p>月考核</p><p>年度考核</p>
</td>
<td class="article">
<table>
<tr><TD>全部订单</TD></tr>
</table>
<table>
<tr><td>查询</td></tr>
</table>
<table></table>
</td>
</tr>
</table>
</tbody>
</table>
</body>
</html>
1回答
-
好帮手慕久久
2020-06-27
同学你好，问题解答如下:
1. 结构上有如下问题：
由于tbody中没有写tr与td，所以tbody中的table与整体的table并列排布了:
使用表结构标签：thead、tbody、tfoot时，它们内部要写tr和td，嵌套表格要写在td中，因此修改如下：
2. 浏览器在渲染表格时，会自动添加上tbody，如下：
所以table中会有tbody；因此tr不是table的直接子元素，“.main table > tr > .aside”这句样式不会生效，可做如下修改：
如果我的回答帮到了你，欢迎采纳，祝学习愉快！
0
相似问题