使用div+CSS将页脚始终控制在页面最下方的方法

tml和body的高度并不一定相同，在内容少的时候，body的高度要小于html，当然这只会出现在body中的内容所占的空间高度小于浏览器的视口高度的时候，此时html的高度大于body的高度。网页中的元素都是以body最为参考，所以有必要保持html和body的高度相同。

CSS Code复制内容到剪贴板

html,body{height:100%;}    

第一种方法：
在body中使用两个容器，包括网页的页脚和另外一部分（container）。设置container的高度为100%；页脚部分使用 负外边距 保持其总是在最下方。

CSS Code复制内容到剪贴板

html, body {     
    height:100%;     
}     
.fl {     
    float:left;     
    display:inline;     
}     
#container {     
    width:100%;     
    height:300px;     
    overflow:hidden;     
    height:100%;     
    border-bottom:70px #FFFFFF solid;     
}     
.aside {     
    width:30%;     
}     
.article {     
    width:70%;     
}     
#footer {     
    height:50px;     
    width:100%;     
    clear:both;     
    margin-top:-50px;     
    border-bottom:1px solid #e0e0e0;     
    border-top:1px solid #e0e0e0;     
}    

XML/HTML Code复制内容到剪贴板

<div id="container">     
    <div id="header">     
        <div>     
            <img src="" width= height= alt="" />     
            <div>     
                <p>fddfv</p>