flexbox是2009年W3C提出的一种全新的可伸缩的CSS布局方式。依赖flexbox,我们可以更简单、高效的完成可伸缩式页面的布局.flexbox一共经历了三个版本,分别为老,tweener,新的,这三种版本下的显示属性值不一样,分别为“显示:盒”,“显示:flexbox”,“显示:flex .flexbox中有两个非常重要的概念:flex容器(flex容器)和flex项目(flex项目),当我们给一个元素添加一个“显示:flex”属性后,这个元素就会变成一个flex容器,它的直接子元素就会变成flex项目成为一个flex容器成员。特别是当我们给一个元素设置成flex容器时,会在文档中生成一个伸缩容器,伸缩容器会为子元素内容生成一个伸缩容器上下文(FFC)。伸缩容器不是块容器,所以flex项目不能使用那些用来控制块元素布局的属性,例如,清晰,浮动,vertical-align属性。
flexbox容器的属性:
justify-content
对齐项目
flex-direction
flex-wrap
flex-flow
align-content
flexbox项目的属性:
为
flex-grow
flex-shrink
flex-basis
flex
align-self
11、flex属性是flex-grow, flex-shrink和flex-basis属性的简写形式,默认值为0 1汽车
12日align-self属性用于设置单个项目与其他的项目不一样的对齐方式,可覆盖容器的对齐项目属性