定位属性：position

position:

        static:默认

        relative:相对定位

        absolute:绝对定位（脱离文档流的属性）

            1.向上级寻找position

             2.上级没有position则相对于浏览器定位（仅对当前页面有效的定位，）

        fixed:视窗定位（相对浏览器窗口）

            固定在浏览器窗口的某一位置进行定位

定位尺寸属性：top/right/bottom/left

脱落文档流

文档流：元素排版布局过程中，元素会自动从左到右，从上到下的流式排列。

脱离文档流：就是将元素从普通的布局排版中拿走，其盒模型在定位的时候，会当做脱离文档流的元素不存在而进行定位

z-index

解决使用定位时的重叠问题

float漂浮和清除

left：左漂浮

right：右漂浮    

both:清除全部漂浮

clore:清除漂浮

flex布局（flexible box 弹性布局）

容器属性：

flex-direction：主轴方向

flex-wrap：换行

    nowrap:不换行

    wrap:换行

    wrap-reverse:换行 相反 向上换行

flex-flow:direction和wrap的简写属性

justify-content:主轴对齐方式

align-item:交叉轴对齐方式

align-content:多条轴对齐方式

项目属性：

order:项目的排列顺序

flex-basis:项目占据主轴空间

flex-grow:项目放大比例（分割剩余空间）

flex-shrink:项目的缩小比例

flex ：简写属性

align-self:设定自身的对齐方式    

flex

flex

flex-grow,flex-shrink,flex-basis的简写（默认 0 1 auto）

两个特殊值：auto( 1 1 auto) | none(0 0 auto)

示范：flex:auto

align-self:单独对一个项目设定交叉轴对齐方式

align-self:flex-end;