table设置行高百分比不起作用
来源:3-10 作业题
慕UI1013004
2019-10-04 11:53:24
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML结构搭建作业</title> <style type="text/css"> a{text-decoration: none; color:#000000;} pre{font-family:"微软雅黑", "黑体", "华文细黑"; font-size:16px; color:#000000;} p{ font-size:15px; } </style> </head> <body> <!-- 网页结构布局使用表格标签 --> <table width="100%" bgcolor="#f8f8ff"> <!-- 顶部 --> <tr width="100%"><td bgcolor="#e1f2f9" width="100%"> <table width="100%"> <tr> <!-- 慕课网logo --> <td width="5%" valign="middle"><img src="素材/images/logo.png" alt="慕课网logo" height="45px"/></td> <!-- 导航区 --> <td width="60%" valign="middle"><table > <tr > <td><a href="https://www.imooc.com/" target="_blank">学校概况 </a></td> <td><a href="https://www.imooc.com/" target="_blank">机构设置 </a></td> <td><a href="https://www.imooc.com/" target="_blank">师资队伍 </a></td> <td><a href="https://www.imooc.com/" target="_blank">科学研究 </a></td> <td><a href="https://www.imooc.com/" target="_blank">招生就业 </a></td> <td><a href="https://www.imooc.com/" target="_blank">图书馆 </a></td> <td><a href="https://www.imooc.com/" target="_blank">校长信箱 </a></td> <td><a href="https://www.imooc.com/" target="_blank">校园导航 </a></td> </tr> </table></td> <!-- 快速通道 --> <td width="20%" valign="middle"> <table> <tr><td>快速通道</td> <td> <form action="#"> <select name="fast_track" > <option value="volvo" selected>volvo</option> <option value="volvo1">volvo1</option> <option value="volvo3">volvo2</option> </select> </form></td></tr></table></td> </tr> </table></td></tr> <!-- banner图 --> <tr ><td valign="middle"> <img src="素材/images/banner.jpg" alt="banner图" width="100%" height="250px"/> </td></tr> <!-- 新闻区 --> <tr ><td width="100%" valign="middle" height="300px"> <table width="70%"> <tr> <td> <dl> <p><dt>慕课快讯 基层风采 媒体聚焦 慕课视频 >></dt></p> <p><dd>>慕课平台课程扩容 涵盖多个领域12-30</dd></p> <p><dd>>李克强主持座谈会 葛优刘国梁被请入中南海12-30</dd></p> <p><dd>>台军演习“歼灭”解放军 专家:自欺欺人12-30</dd></p> <p><dd>>气象局停发雾霾预警?回应:正协商联合发布机制12-30</dd></p> <p><dd>>独家:小米影业解散宣发部门 宣布成立一年后刹车12-30</dd></p> <p><dd>>“哑巴群众”开口说话 是稿件有误还是新闻造假?12-30</dd></p> <p><dd>>要置业。看看2017全球楼市掘金路线图12-30</dd></p> <p><dd>>王健林与房地产越来越远呢?贾跃亭与房地产越来越近12-30</dd></p> </dl> </td> <td><dl> <p><dt>慕课快讯 基层风采 媒体聚焦 慕课视频 >></dt></p> <p><dd>>慕课平台课程扩容 涵盖多个领域12-30</dd></p> <p><dd>>李克强主持座谈会 葛优刘国梁被请入中南海12-30</dd></p> <p><dd>>台军演习“歼灭”解放军 专家:自欺欺人12-30</dd></p> <p><dd>>气象局停发雾霾预警?回应:正协商联合发布机制12-30</dd></p> <p><dd>>独家:小米影业解散宣发部门 宣布成立一年后刹车12-30</dd></p> <p><dd>>“哑巴群众”开口说话 是稿件有误还是新闻造假?12-30</dd></p> <p><dd>>要置业。看看2017全球楼市掘金路线图12-30</dd></p> <p><dd>>王健林与房地产越来越远呢?贾跃亭与房地产越来越近12-30</dd></p> </dl></td> <td><img src="素材/images/weixin.png" alt="微信"></td></tr> <tr><td colspan="3"> 近期专题 </td></tr> <tr><td><img src="素材/images/1.png" alt=""/><p>教育发展基金专题</p></td> <td ><img src="素材/images/2.png" alt=""/><p>教育发展基金专题</p></td> <td ><img src="素材/images/3.png" alt=""/><p>教育发展基金专题</p></td></tr> </table> </td></tr> <!-- 友情链接区 --> <tr ><td width="100%" bgcolor="#e1f2f9" valign="middle"> <table > <tr > <td><a href="https://www.imooc.com/" target="_blank">文化站点 </a></td> <td><a href="https://www.imooc.com/" target="_blank">信息服务 </a></td> <td><a href="https://www.imooc.com/" target="_blank">校友会 </a></td> <td><a href="https://www.imooc.com/" target="_blank">OA系统 </a></td> <td><a href="https://www.imooc.com/" target="_blank">教务管理系统 </a></td> <td><a href="https://www.imooc.com/" target="_blank">网络教学平台 </a></td> <td><a href="https://www.imooc.com/" target="_blank">VPN服务 </a></td> <td><a href="https://www.imooc.com/" target="_blank">acm/oj </a></td> <td><a href="https://www.imooc.com/" target="_blank">旧版入口 </a></td> <td><a href="https://www.imooc.com/" target="_blank">站群系统 </a></td> </tr> </table> </td></tr> <!-- 页脚区 --> <tr bgcolor="#89a9bd" width="100%"><td valign="middle" height="50px"> <pre>Copyright © 2017 imooc.com ALL Rights Reserved | 京ICP备 13046642号-2</pre> </td></tr> </table> </body> </html>
2回答
同学你好,给table标签设置高度没有生效是因为内容比较多,table的高度是内容撑开的。
可能是分辨率的原因,老师在这边测试同学提供的代码,是没有出现纵向滚动条的。
建议:同学可以根据实际情况把内容的高度调整的小一些,
如果帮助到了你,欢迎采纳~祝学习愉快~
慕UI1013004
提问者
2019-10-06
如下图所示,不能把页面的整体结构像老师那样显示完全,必须拖动右边滑动条才可以展示完全。本来想设置table的高度来控制,但是高度设置了不起作用
相似问题