关于banner图100%显示的问题,具体问题见代码最后

关于banner图100%显示的问题,具体问题见代码最后

<DOCTYPE html>

<html>

<head>

<title></title>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

<body>

<table width="100%" cellspacing="0">

<!--以下顶部-->

<tr bgcolor="#e1f2f9" width="100%">

<td height="80px">

<table width="100%">

<tr>

<td><img src="images/logo.png" /></td>

<td align="center"><span>学校概况&nbsp;机构设置&nbsp;师资队伍&nbsp;科学研究&nbsp;招生就业&nbsp;校长信箱&nbsp;校园导航</span></td>

<td align="right">快速通道</td>

<td>

<form>

<select>

<option value="Volvo" selected="">Volvo</option>

<option value="Volvo1">Volvo1</option>

<option value="Volvo2">Volvo2</option>

<option value="Volvo3">Volvo3</option>

<option value="Volvo4">Volvo4</option>

</select>

</form>

</td>

</tr>

</table>

</td>

</tr>

<!--以下banner区-->

<tr>

<td height="496px"><img src="images/banner.jpg" width="100%"/></td>

</tr>

<!--以下新闻区-->

        <tr>

<td>

<table align="center" width="80%">

<tr>

<td>

<ul>

<li><b>慕课快讯&nbsp;基层采风&nbsp;媒体聚焦&nbsp;慕课视频</b></li>

<li>慕课平台课程扩容&nbsp;涵盖多个领域&nbsp;12-30</li>

<li>李克强主持座谈会&nbsp;葛优刘国梁被请&nbsp;进中南海&nbsp;12-30</li>

<li>台军演习"歼灭"解放军&nbsp;专家:自欺欺人&nbsp;12-30</li>

<li>气象台停发霾预警?回应:正协商联合发布机制&nbsp;12-30</li>

<li>独家:小米影业解散宣发部门&nbsp;宣布成立一年后刹车&nbsp;12-30</li>

<li>"哑巴群众"开口说话&nbsp;是稿件有误还是新闻有假&nbsp;12-30</li>

<li>要置业,看看2017年全球楼市掘金路线图&nbsp;12-30</li>

<li>王健林与房地产越来越远?贾跃亭与房地产越来越近&nbsp;12-30</li>

</ul>

</td>

<td>

<ul>

<li><b>慕课快讯&nbsp;基层采风&nbsp;媒体聚焦&nbsp;慕课视频</b></li>

<li>慕课平台课程扩容&nbsp;涵盖多个领域&nbsp;12-30</li>

<li>李克强主持座谈会&nbsp;葛优刘国梁被请&nbsp;进中南海&nbsp;12-30</li>

<li>台军演习"歼灭"解放军&nbsp;专家:自欺欺人&nbsp;12-30</li>

<li>气象台停发霾预警?回应:正协商联合发布机制&nbsp;12-30</li>

<li>独家:小米影业解散宣发部门&nbsp;宣布成立一年后刹车&nbsp;12-30</li>

<li>"哑巴群众"开口说话&nbsp;是稿件有误还是新闻有假&nbsp;12-30</li>

<li>要置业,看看2017年全球楼市掘金路线图&nbsp;12-30</li>

<li>王健林与房地产越来越远?贾跃亭与房地产越来越近&nbsp;12-30</li>

</ul>

</td>

<td align="center"><img src="images/weixin.png" /></td>

</tr>

</table>

</td>

</tr>

<!--以下近期专题区-->

<tr>

<td>

<table  align="center" width="80%">

<tr> 

<td colspan="3">近期专题</td>

</tr>

<tr>

<td align="center">

<dl>

<dt><img src="images/1.png" /></dt>

<dd>教育发展基金专题</dd>

</dl>

</td>

<td align="center">

<dl>

<dt><img src="images/2.png" /></dt>

<dd>教育发展基金专题</dd>

</dl>

</td>

<td align="center">

<dl>

<dt><img src="images/3.png" /></dt>

<dd>教育发展基金专题</dd>

</dl>

</td>

</tr>

</table>

</td>

</tr>

<!--以下友情链接区-->

<tr>

<td bgcolor="#e1f2f9" align="center" valign="middle" height="60px">

<span>文化站点   信息服务   校友会   OA系统   教务管理系统   网络教学平台   vpn服务   acm/oj   旧版入口   站群系统</span>

</td>

</tr>

<!--以下页脚区-->

<tr bgcolor="#89a9bd" align="center" valign="middle" height="80px">

<td>Copyright &copy; 2017 imooc.com All Rights Reserved |京ICP备 13046642号-2</td>

</tr>

</table>

</body>

</html>

1老师,我设置了img那里width="100%",为什么每个模块中间有空白?我表格有设置cellspacing="0"的. 

2我作业里在td那里设置的width="100%",网页显示有滚动条,我拉动滚动条看到banner图是完全显示的,这样是不对吗?

3为什么顶部下拉列表与快速通道水平不在一条线上,我设置水平与垂直居中都没有反应.


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

2回答
小丸子爱吃菜 2017-12-17 13:56:18

要么不给img所在的td设置高度,要么将img的高度设置为100%。

怎么都被占用了呢 2017-12-14 17:49:32

前2个问题都不太明白你的意思呢,你给哪个img设置了宽度100%,模块间有空白呀

还有你是给哪个td设置的宽度100%呀。能详细描述一下吗

第三个问题我是看明白了,因为form是个块状元素(学了css之后,你就会知道块状元素的特性),使用align设置居中是不起作用的。,我们可以这么修改:

http://img1.sycdn.imooc.com//climg/5a32490d0001392a08680382.jpg

  • 提问者 努力的人儿 #1
    就是bannerl图那里,我之前作业是在td那里设置的width="100%",页面显示是有滚动条,我电脑划动滚动条看到的banner图是完全显示的,老师指出banner图没有100%显示,建设img设置width="100%",我修改后刷新网页,上下模块之间就出现空白了
    2017-12-16 21:34:27
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师