求HTML指教,当浏览器窗口大小变化时,如何让内容布局不变

最近在做网页的时候发现当浏览器窗口最大化时,布局显示正常,可是如果变小的时候整个布局就乱了,非常难看,想请问下如何能做到像下图百度这样窗口大小变化时布局不变,最多就是看不... 最近在做网页的时候发现当浏览器窗口最大化时,布局显示正常,可是如果变小的时候整个布局就乱了,非常难看,想请问下如何能做到像下图百度这样窗口大小变化时布局不变,最多就是看不到了,请各位HTML高手不吝赐教,不胜感激 展开
 我来答
我卖烧饼不卖馍
2018-04-05 · TA获得超过8750个赞
知道小有建树答主
回答量:36
采纳率:96%
帮助的人:3.7万
展开全部
  • 如果想要保持布局不变,可以给该元素(如div)设置最小宽度属性。

  • 在网页中,如果一个元素没有设置最小宽度(min-width),这时当浏览器缩小到一定程度时,元素中的布局可能会发生变化。

  • 设置代码如下:

  • <html>
      <head>
         <title>主页面</title>
    <style>
    body{
      margin:0px;
      width:1350px;
      min-width:1024px;
      max-width:100%;
      height:100%;
      background-color:#F0F0F0;
    }
    #head{
      background-color:#FFFF00;
      width:1350px;
      height:100px;
      min-width:1024px;
    }
    #center{
      background-color:#00FFFF;
      width:1350px;
      min-height:100%;
      position:relative;
      min-width:1024px;
    }
    #foot{
      background-color:#FF00FF;
      width:1350px;
      height:100px;
      min-width:1024px;
    }
    #left{
       width:150px;
    height:100%;
    background-color:#EEEEEE;
    position:absolute;
    margin-left:60px;
    }
    #main{
       width:924px;
    height:100%;
    background-color:#EE00FF;
    position:absolute;
    margin-left:210px;
    }
    #right{
       width:150px;
    height:100%;
    background-color:#EEFF00;
    position:absolute;
    margin-left:1134px;
    }
    </style>
      </head>
      <body>
        <thead> 
      <div id="head">
         你好
      </div>
    </thead>
    <tbody>
     <div id="center">
       <div id="left"></div>
    <div id="main"></div>
    <div id="right"></div>
     </div>   
    </tbody>
    <tfoot>
    <div id="foot">大家好</div>
    </tfoot>
      </body>
    </html>
烂苹果1994
2017-08-04 · TA获得超过307个赞
知道小有建树答主
回答量:485
采纳率:100%
帮助的人:255万
展开全部
简单点就是布局设置宽度的时候,用百分百设置。但这样还是很容易出问题(内容溢出,内容移位)。最好就是用响应式布局,专门针对各个分辨率进行设计css。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2015-10-05
展开全部
将你的网页的元素的大小和位置固定住,通过css中的width和height属性来设定。
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
兔蜜美食
2017-07-11
知道答主
回答量:31
采纳率:100%
帮助的人:3.4万
展开全部
设置准确宽度呗
想自适应就这是百分比
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
?>

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式