wang_wie 2017-06-08 02:46 采纳率: 100%
浏览 1664
已采纳

网页右侧有空白,我就想设置成1440px宽度的。请问该怎么更改?

图片说明

如上图所示:网页右侧区域会有空白,该怎么更改代码?    
源代码如下:
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link type="text/css" rel="stylesheet" href="style/reset.css" />
</head>

<body>
    <div>
        <div class="context1-top">
          <table bgcolor="#FBFBFB">
              <tr width="1440">
                <td><img src="image/logo.png" width="897" height="61" /></td>
                <td width="90px" align="center" valign="bottom" ><a href="#">系统登录</a></td>
                <td valign="bottom" width="90px" align="center" ><a href="#">新闻中心</a></td>
                <td valign="bottom" width="90px" align="center" ><a href="#">通知公告</a></td>
                <td bgcolor="#FBFBFB" width="273">&nbsp;</td>
              </tr>
            </table>

      </div>

        <div>
        <img src="image/background image.png" width="1440" height="199" /> 
        </div>
    </div>

    <div class="context2">
        <div class="context2-center">
          <div class="context2-center-top">
                <table><tr >
                    <td width="90px" height="40px" align="center" valign="middle"><font size="2">新闻中心</font></td>
                </tr></table>
          </div>
          <div class="context2-center-top2">
                <table>
                    <tr >
                        <td width="30"></td>
                      <td width="" height="40px" align="left" valign="middle" v>提升工会干部素质心</td>
                    </tr>
                </table>
          </div>
          <div>
            <img src="image/line.png" width="1000" height="13" /> 
          </div>
          <div class="context2-table">
            <table width="1000" height="25" align="center"  >
                <tr >
                    <td width="320"></td>
                    <td><font size="2">发布时间:</font></td>
                    <td><font size="2">2017-06-03</font></td>
                    <td><font size="2">|</font></td>
                    <td><font size="2">作者:</font></td>
                    <td><font size="2">gg</font></td>
                    <td><font size="2">|</font></td>
                    <td><font size="2">阅读:</font></td>
                    <td><font size="2">318次</font></td>
                    <td width="320"></td>
                </tr>
            </table>
          </div>
          <div class="context2-context"> </div>

           <div class="context2-context2">
                <table>
                    <tr height="15"></tr>
                    <tr>
                      <td width="35"></td>
                        <th><font size="2" color="#838383">上一篇:</font></th>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td width="35"></td>
                        <td><font size="2" color="#838383">下一篇:</font></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr></tr>
                </table>    
           </div>
          <div class="context2-bottom"></div>  

      </div>
    </div>
    <div>
       <div class="context3">
            <table height="65">
                <tr height="40"></tr>
                <tr height="25">
                    <td width="580"></td>
                    <td align="center"><font size="2">系统登录</font></td>
                    <td align="center" width="40"> <font size="2" >|</font></td>
                    <td align="center"><font size="2">新闻中心</font></td>
                    <td align="center" width="40"><font size="2">|</font></td>
                    <td align="center"><font size="2">通知公告</font></td>
                    <td  align="center" width="580"></td>
                </tr>
            </table>
       </div>
      <div><img src="image/foot.png" width="1440" height="106" /></div>
   </div>
</body>
</html>

@charset "utf-8";
/* CSS Document */

body,ul,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div,dl,dt,dd,iput{
margin: 0;
padding: 0;
text-align: center;
}

.context1-top{width:1440px;}
.context2-center{ width:1000px; background-color:; margin-left: auto; margin-right: auto;}
.context2-center-top{ height:40px; background-color:#EAEAEA; vertical-align:central;}
.context2-center-top2{height:50px; background-color:#FFFFFF}
.context2{background-color:#F9F9F9; width:1440px;}
.context2-table{background-color:#FFFFFF}
.context2-context{background-color:#FFFFFF; width:1000px; height:300px;}
.context2-context2{ margin-top:15px; height:70px; width:1000px;background-color:#FFFFFF; }
.context3{ height:65px;background-color:#E9E9E9; width:1440px;}
.context2-bottom{ width:1440px; height:25px; background-color:#F9F9F9;}







  • 写回答

4条回答

  • himushroom 2017-06-08 03:14
    关注

    图片说明

    看上图哦,你这个地方设置了宽度.context2-bottom{width:1440px},但是这个context2-bottom是在context2-center里面的,你给context2-center设置了居中和width:1000px,很显然这样的话context2-bottom这个盒子就突破天际,顶出来...

    两种方法哦,你把context2-bottom里面width的属性去掉,或者简单粗暴的在context2-center里面加一个overflow:hidden的属性就OK啦

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

悬赏问题

  • ¥60 Python如何后台操作Vmwake虚拟机键鼠
  • ¥15 关于#matlab#的问题:期望的系统闭环传递函数为G(s)=wn^2/s^2+2¢wn+wn^2阻尼系数¢=0.707,使系统具有较小的超调量
  • ¥15 FLUENT如何实现在堆积颗粒的上表面加载高斯热源
  • ¥30 截图中的mathematics程序转换成matlab
  • ¥15 动力学代码报错,维度不匹配
  • ¥15 Power query添加列问题
  • ¥50 Kubernetes&Fission&Eleasticsearch
  • ¥15 報錯:Person is not mapped,如何解決?
  • ¥15 c++头文件不能识别CDialog
  • ¥15 Excel发现不可读取的内容