css – 窗口底部的Div和适应性高度div

有没有办法让div总是在窗口的底部,另一个div来改变它的高度以填充它留下的任何空间,并且如果div的内容太长,div将滚动. (我从不希望窗口滚动).

最好通过图片说明:

div layout http://img401.imageshack.us/img401/3209/divs.png

绿色div总是将自己置于窗口的底部,橙色div将填补空白.当窗口较小时,如右图中,橙色div将更小并将滚动.

绿色div可以切换.有时绿色div将显示:none,然后橙色div将延伸到底部.当绿色div显示:再次阻止时,它将再次显示图片.

它必须在IE6中工作.

到目前为止,我可以通过以下方式获得绿色div:

position: absolute;
bottom: 0;

但我不知道如何让橙色div做我想做的事.

解决方法

你可以看看A List Apart的“探索页脚”,

http://www.alistapart.com/articles/footers/

希望能帮助到你,
思南

编辑:(纯CSS方式)

你的加价:

<div class="non-footer">Your content goes here.</div>
<div class="footer">Here is for footer content.</div>

你的CSS:

body,html,.non-footer {
    height: 100%;
    min-height: 100%;
    width: 100%;
}
.footer {
    height: 150px;
    margin-top: -150px;
    width: 100%;
}

我可能会遗漏一些细节,但这应该有效,它提供了技巧背后的基本想法.

思南.

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效