UI布局笔记

1.宽度一般用百分比自适应的方式，充分利用css浮点和定位来布局；
2.一列布局，一般是固定宽度，高度自适应，随着内容增加，不断撑开；

body{
    margin: 0;padding: 0;  //清除全局的margin样式
}
.top{
    height: 100px;
    background: chartreuse;
}
.main{
    width: 400px;
    height: 400px;
    background: lightcyan;
    margin: 0 auto; //0表示上下,auto表示左右
}
.foot{
    height: 100px;
    width: 400px;
    background: salmon;
    margin: 0 auto;
}

        <div id=