布局流程图
原则
- 没有设计稿 不写代码
- 不到万不得已,不要写死 width 和 height
- 尽量用高级语法,如 calc、flex
- 如果是 IE,就全部写死
口诀
- float(IE5)
- 儿子全加 float: left (right)
- 老子加 .clearfix
- flex
- 老子加 display: flex
- 老子加 justify-content: space-between;
如果宽度不够,可以用 margin: 0 -4px;
(但是做移动端的时候会有滑动现象出现 加overflow:hidden;)
.clearfix:after{
content: '';
display: block;
clear: both;
}
.clearfix{
zoom: 1;
}