布局

布局布局布局布局

1.盒模型

使用box-sizing:border-box设置宽高

2.BFC

概念

块级格式化上下文,内部元素不会影响边界以外元素

形成条件

1. float不是none
2. position是absolute或fixed
3. overflow不是visible
4. display是flex inline-block等

3.margin-padding

margin-right和margin-bottom为负数，则自身不动，其他元素动

4.float

        .clearfix:after {
            content: '';
            display: table;
            clear: both;
        }

5.flex

1. flex-direction
2. just-content
3. align-items
4. flex-wrap
5. align-self