Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性
设为Flex布局以后,子元素的float、clear和vertical-align属性将失效
.box{ display: -webkit-flex; display: flex; flex-direction: row | row-reverse | column | column-reverse; flex-wrap: nowrap | wrap | wrap-reverse; flex-flow: <flex-direction> || <flex-wrap>; justify-content: flex-start | flex-end | center | space-between | space-around; align-items: flex-start | flex-end | center | baseline | stretch; align-content: flex-start | flex-end | center | space-between | space-around | stretch; }
.item { order: <integer>; flex-grow: <number>; flex-shrink: <number>; flex-basis: <length> | auto; flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]; align-self: auto | flex-start | flex-end | center | baseline | stretch; }
|