zoukankan      html  css  js  c++  java
  • Footer固定在页面底部(CSS)

    <style type="text/css">
      #wapper{                    
            position: relative;    /*重要!保证footer是相对于wapper位置绝对*/  
            height: auto;           
            min-height: 100%;       
        }
      #main-content{ 
            background:grey;    
            padding-bottom: 60px;   /*重要!给footer预留的空间*/  
        } 
      #footer{ 
        background: green; 
        width: 100%; 
        position: absolute; 
        bottom: 0;              /* 关键 */ 
        height:60px;             /* 此方法的缺点:页脚的高度需要手动调 */
      } 
    </style>


    <body style="margin:0">
        <div id="wapper">  
            <!-- 主要内容 -->  
            <div id="main-content">
                这里是内容
            </div>  
            <!-- 页脚 -->  
            <div id="footer">  
                这里是页脚
            </div>  
        </div>  
     </body>
    
    
    
     
    KEEP LEARNING!
  • 相关阅读:
    数论学习之乘法逆元
    数论学习之扩展欧几里得
    数论学习之费马与欧拉
    一次函数
    东南西北
    接水问题
    脱水缩合
    背单词
    单词接龙
    字符串,字符数组
  • 原文地址:https://www.cnblogs.com/roronoa-sqd/p/5440485.html
Copyright © 2011-2022 走看看