记录采坑：

博客记录问题，用作回忆用，不喜勿喷！

　　html,body{width: 100%; height: 100%}这是初始定义的宽高。在布局越写越复杂的时候，布局很容易出现问题，例如一个页面中有若干个需要 display: none/block 来隐藏显示的其他页面时，布局容易出现背景只有一屏，超过一屏的地方空白，没有背景！即body、或者根div main它的高度远远小于实际高度，当然这是布局有问题，一般不会出现这种问题，那么在已经出现了这种问题又不想修改布局（布局很复杂）的情况下，采用如下办法即可解决：

　　在根根根！div下 加上 min-height: 100%; 去掉 height: 100%; 这个能解决一部分问题，至于添加了上述代码，页面底部仍然还有一部分留白（无背景），那应该是最后一个元素运用了 margin-bottom: xxvw；检查一下，页面最后一个元素是否有 margin 属性，如有，在其后面添加一个空的div标签即可解决问题。如还不行，在那个添加的空的div标签内部加上 &nbsp 。解决问题

     

CSS布局-body高度不等于页面高度的更多相关文章

  1. javascript：控制一个元素高度始终等于浏览器高度

    window.onresize = function(){ this.opHtight()} //给浏览器添加窗口大小改变事件window.onresize = function(){ this.op ...

  2. css布局相关:涉及到常见页面样式难点

    一.display:table用法 Table:display:tableBody:table-row-group;Tr: table-row;Td: table-cell https://www.c ...

  3. PHP.5-DIV+CSS布局网站首页实例

    DIV+CSS布局网站首页实例 网站页面布局 http://www.sj33.cn/digital/wyll/201501/42379.html[页头.页脚.侧边栏和内容区域] #避免各浏览器对CSS ...

  4. DIV+CSS布局中自适应高度的解决方法

    div乱跑问题  (文件<DIV+CSS布局中自适应高度的解决方法.rar>)   float 是个很危险的东西 得小心使用 本来有一很好的关于CSS+DIV的论坛 不过现在关门了 甚是可 ...

  5. CSS布局中最小高度的妙用

    CSS布局中最小高度的妙用 --最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持BOX的高度为一定,超出就自动向下延伸最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持B ...

  6. CSS 控制Html页面高度导致抖动问题的原因

    CSS 控制Html页面高度导致抖动,这类由高度导致页面抖动的问题,其实究其根本原因是滚动条是否显示导致的 在CSS中添加如下代码: html,body{ overflow-y:scroll;} ht ...

  7. CSS布局：div高度随窗口变化而变化(BUG会有滚动条)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. css3 的 calc()函数在布局中的使用----头部高度固定，页面正好占满一屏

    最近项目遇到一个布局需求,头部高度固定,页面需要刚好占满一屏幕. 如下示意图: 方法:使用calc .wrap{ position: relative; margin-left: 24px; marg ...

  9. DIV+CSS布局时， DIV的高度和宽度特性

    这个没有特别的做要求,你要根据你自己的页面整体布局来设置,还有根据div的特性来设置,div默认情况是宽度最大化(100%).高度最小化,高度随着内容自动伸展: 一般情况做网页的话,大部分都是固定了总 ...

随机推荐

  1. Deeplab v3+的结构的理解，图像分割最新成果

    Deeplab v3+ 结构的精髓: 1.继续使用ASPP结构, SPP 利用对多种比例(rates)和多种有效感受野的不同分辨率特征处理,来挖掘多尺度的上下文内容信息. 解编码结构逐步重构空间信息来 ...

  2. poj 1164 深度优先搜索模板题

    #include<iostream> //用栈进行的解决: #include<cstdio> #include<algorithm> #include<cst ...

  3. 解决wine中文字体方块或乱码

    从Windows使用字体 如果有一个安装了Windows的分区, 可以通过链接它们来使用其字体. 例如, Windows的C:\盘被挂载在/windows: # ln -s /windows/Wind ...

  4. PHP 批量操作删除，支持单个删除

    PHP  执行部分: <?php include('checkadmin.php'); header('Content-Type: text/html; charset=utf-8'); if( ...

  5. Java正则表达式草稿程序*2

    1.成绩统计. 输入文件input.txt: 张三 语文12 数学31 英语11 李四 语文22 数学22 英语22 王五 语文33 数学33 英语33 期待输出output.txt: 张三 语文12 ...

  6. CSS hover

    CSS hover hover 鼠标移动到当前标签上时,以下css属性才能生效 <!DOCTYPE html> <html lang="en"> <h ...

  7. mysql awr v1.0.3修正说明以及发布

    本版本计划修正或者包含如下内容: 1.innodb buffer_pool只是分配的vm大小,实际并不一定真正使用这么多,还可能会有内存泄露,故调整从innodb_buffer_pool_stats获 ...

  8. COCO数据集格式互换

    poly->compacted RLE:     seg=np.array([312.29, 562.89, 402.25, 511.49, 400.96, 425.38, 398.39, 37 ...

  9. 无实体反序列化Json

    public class ExectendHelp { private int index = 0; public void GetLast(JObject obj, ref JToken token ...

  10. Java基础学习-注释的概述和分类

    /*     注释:用于解释说明程序的文字          分类:             单行://             多行:/**/       作用:解释说明程序,提高程序的阅读性 */ ...