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

来源：互联网发布：网络格斗编辑：程序博客网时间：2024/05/29 09:26

<!DOCTYPE html>  <html lang="en">  <head>      <meta charset="UTF-8">      <title>底部始终在文档末尾，当文档较长时跟随在文档末尾，当文档较短时在窗口底部</title>    <style type="text/css">        /* 底部自适应文档和窗口  */        html,body{width:100%;height:100%;margin:0;}        p{margin:0px;line-height: 100px;}        .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;}      </style></head>  <body>    <div class="g-doc">        <div class="g-bd">            <p>请增加或减少内容，或改变窗口大小，以便查看效果。</p>            <p>请增加或减少内容，或改变窗口大小，以便查看效果。</p>            <p>请增加或减少内容，或改变窗口大小，以便查看效果。</p>            <p>请增加或减少内容，或改变窗口大小，以便查看效果。</p>            <p>请增加或减少内容，或改变窗口大小，以便查看效果。</p>        </div>    </div>    <div class="g-ft">        底部始终在文档末尾，当文档较长时跟随在文档末尾，当文档较短时在窗口底部。    </div>    </body>  </html>

阅读全文

1 0