html底部自动适应,div+css底部自适应文档和窗口

本文主要跟大家分享：当文档较长时底部跟随在文档末尾，当文档较短时在窗口底部的CSS实现方式。下面青岛星网给出范例实现代码。

HTML范例代码

请增加或减少内容，或改变窗口大小，以便查看效果。

请增加或减少内容，或改变窗口大小，以便查看效果。

请增加或减少内容，或改变窗口大小，以便查看效果。

请增加或减少内容，或改变窗口大小，以便查看效果。

请增加或减少内容，或改变窗口大小，以便查看效果。

底部始终在文档末尾，当文档较长时跟随在文档末尾，当文档较短时在窗口底部。

CSS范例代码/* 底部自适应文档和窗口 */

html,body{width:100%;height:100%;margin:0;}

.g-doc{position:relative;min-height:100%;_height:100%;}

.g-bd{padding:0 0 60px;zoom:1;}

.g-ft{height:50px;margin:-50px 0 0;background:#ddd;}