height:100% 为什么无效？？

有时候需要一个让一DIV的高度自动拉伸为整个屏幕的高度，即100%的高度：

.demo{
    width: 100%;
    height: 100%;
    background: url(big-size-bg.png);
}

假设big-size-bg.png是一张很大的背景图片，那么这样在浏览器中解析的结果是什么都看不见，再用offsetHeight测试结果是0（在IE旧版本测试中不为0，是一个很小的高度），所以上面的 height:100%根本木有起作用！

原来，页面中的容器（块级元素）的高度在没有设定height的情况下是根据容器的内容来自动拉伸的，所以，.demo的高度其实是body元素的高度，而body元素的高度是html元素的高度，所以，解决的办法是给.demo的所有父元素（body和html）加上height:100%就可以了：

html{
    height: 100%;
}
body{
    height:100%;
}
.demo{
    width: 100%;
    height: 100%;
    background: url(big-size-bg.png);
}

ok，这样就行了。