BODY内容高度不够浏览器高时BODY背景不在最下面的解决办法

最近遇到这个问题,搜索引擎找到了答案,收藏于此文章。

我们在设计网页的时候经常会碰到要张BODY加背景的情况,BODY里面的内容足够多的时候这个问题一般不被发觉,但在BODY内容比较少的时候会发现BODY的底图背景就出现在页面的某些位置(不是最底部)这样导致了网页看起来不友好,那要如何去改呢?下面把我知道的贴在下面供大家一起交流学习:

CSS代码:
body { background: #FFF url(img/bg.gif) repeat-y; center top; }

如果网页内容较少,body的背景图片只占了浏览器的高度的一部分,很难看,现给body加个最小高度:
body { background:#FFF url(img/bg.gif) repeat-y center top;
min-height:100%; height:auto !important; height:100%; }

在ie下显示很好,但在chrome上依旧不起作用,现把html的高度设为100%,一切ok了,最终代码如下:

html { height:100%;  }  
body { 
    background:#FFF url(img/bg.gif) repeat-y center top;   
    min-height:100%; 
    height:auto !important; 
    height:100%;  
}

原文链接

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值