【CSS】关于flex

flex 属性用于设置或检索弹性盒模型对象的子元素如何分配空间。

如果元素不是弹性盒模型对象的子元素,则 flex 属性不起作用。

设为Flex布局以后,子元素的floatclearvertical-align属性将失效。

容器默认存在两根轴:水平的主轴(main axis)和垂直的交叉轴(cross axis)。主轴的开始位置(与边框的交叉点)叫做main start,结束位置叫做main end;交叉轴的开始位置叫做cross start,结束位置叫做cross end

项目默认沿主轴排列。单个项目占据的主轴空间叫做main size,占据的交叉轴空间叫做cross size

justify-content属性定义了项目在主轴上的对齐方式。

align-items属性定义项目在交叉轴上如何对齐。

 注意:区分设置在容器上的属性和设置在项目上的属性

直接去看阮一峰老师的博文吧,写的很详细~

强烈推荐http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

              http://www.ruanyifeng.com/blog/2015/07/flex-examples.html

posted @ 2017-04-23 10:28  乘客  阅读(194)  评论(0编辑  收藏  举报