flex box布局

例如

<div class="container">
    <div clas="left"></div>
    <div clas="center"></div>
    <div clas="right"></div>
</div>

flex box,有一个伸缩容器flex container 容器中的元素自动变成了伸缩项flex items,例子中container就是伸缩容器,left、center、right是伸缩项

给伸缩容器的css设 display:flex ; flex-flow:row/column/row wrap……

flex-flow为row,给伸缩项设width;flex-flow为column,设height;还可以设flex:value,按比例分配

目前css

.container{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
}
原文地址:https://www.cnblogs.com/danranysy/p/4736074.html