css小技巧

body {
    margin-top:0px;    /* 去除网页上边空白 */
}
/* 大容器，包含下面所有层 */
#container {
    width:800px;
    margin:0px auto;    /* 居中 */
}
/* 头部 */
#header {
    width:100%;
    height:100px;
    background:#FFE1FF;
}
/* 中部，包括左边区(sider)和右边内容区(content) */
#middleBody {
    width:100%;
    overflow:hidden;    /* 隐藏超出的部分 */
}
/* 左边 */
#sider {
    width:200px;
    float:left;
    background:#FFE4E1;
}
/* 右边主内容区 */
#content {
    /* 此两行是#content自适应宽度的关键，旨在与右边界对齐，且不被挤到下面去 */
    padding-right:10000px;
    margin-right:-10000px;
    float:left;
    background:#FFFAF0;
}
/* #sider和#content共同属性，此为自适应高度的关键，旨在#sider和#content下边界对齐，且不会露白*/
.column {
    padding-bottom:20000px;
    margin-bottom:-20000px;
}
/* 底部 */
#footer{
    clear:left;    /* 防止float:left对footer的影响 */
    width:100%;
    height:80px;
    background:#FFE4B5;
}