zoukankan      html  css  js  c++  java
  • 将div一直保持到页面底部

    将div保持到页面底部说的是,页面内容满屏和不满屏都在底部,采用js是最常用的方法,但如果能用纯css解决最好了,有网上找了半天,还是有强人的,方法如下:

    HTML结构:

    <body>
    <div id="container">
       <div id="header"></div>
       <div id="body"></div>
       <div id="footer"></div>
    </div>
    </body>
    

    CSS样式:

    html,
    body {
       margin:0;
       padding:0;
       height:100%;
       _height:100%; /* IE6 hack */
    } 
    #container { 
      min-height:100%; 
      position:relative; 
    } 
    #header { 
      background:#ff0; 
      padding:10px; 
    } 
    #body { 
      padding:10px; 
      padding-bottom:60px; /* Height of the footer */
    }
    #footer {
       position:absolute; bottom:0; 
       100%; 
        height:60px; /* Height of the footer */ 
       background:#6cf; 
    }
  • 相关阅读:
    POJ 1451
    LightOJ 1224
    POJ 2001
    HDU 2072
    POJ 3764
    CH 1602
    CH 1601
    Gym 101873K
    CH 1201
    Gym 101873C
  • 原文地址:https://www.cnblogs.com/asyuras/p/2569554.html
Copyright © 2011-2022 走看看