CSS实现页脚始终在底部

当页面高度小于文档内部高度时,页脚也处于最底部的实现方式
  • CSS

    html,body{
        width: 100%;
        margin: 0;
        padding: 0;
    }
    html{
        min-height: 100%; /* 这个要设置最小高度 */
        position: relative;
    }
    body{
        margin-bottom: 60px; /* footer的高度 */
    }
    .footer{
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 60px;
        background-color: #ff0000;
    }
  • html

    

你可能感兴趣的:(CSS实现页脚始终在底部)