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的高度来控制,但是高度设置了不起作用

相似问题