为什么设置table高度不起作用？

代码如下：

table 应该是块状元素吧！但是为什么设置完高度以后没有显示呢？

源自：项目：网页布局案例 2-10 作业题

收起

2回答

好帮手慕夭夭回答被采纳获得+3积分 2019-08-08 09:49:14

你好同学，这里确实是行高影响的。像文本样式（例如文字颜色，大小，行高）都是可以继承的。所以给banner区域最大的父容器设置行高，它会继承给每一个子元素，即每一个td都会有800px的行高。所以超出表格的高度，高度就没有起作用。banner区域不用设置那么大的行高，直接把行高去掉哦。

祝学习愉快，望采纳。

好帮手慕夭夭 2019-08-07 18:59:40

你好同学，请把完整的html，css代码粘贴（不要）到问答区域，以便老师准确高效的为你查看问题。

祝学习愉快！

提问者 weixin_慕粉8323943 #1

.banner { width: 100%; height: 800px; margin-top: 80px; background: url("images/banner.jpg") center center; line-height: 800px; overflow: hidden; } .banner .mask{ width: 100%; height: 800px; background-color: black; opacity: 0.5; } .banner table{ position: relative; top: -740px; width: 509px; height: 39px; border: 2px solid white; /* 43*3+119+12*3 */ /* height: 294px; */ margin: 0 auto; } .banner table tr td{ border: 2px solid white; height: 39px; } Banner 的HTML 是： <div class="banner">  <div class="mask"> </div>  <table> <tr> <td class="info">1</td> </tr> <tr> <td class="info">1</td> </tr> <tr> <td class="info">1</td> </tr> <tr> <td class="msg">1</td> </tr> </table> </div>

2019-08-08 09:21:51
提问者 weixin_慕粉8323943 #2

我尝试了屏蔽了banner 里面的line-height以后起作用了！

2019-08-08 09:24:18