任何一個容器都可以指定為flex布局
設(shè)為flex布局后癣籽，子元素的脖苏，float.clear.vertical-align的屬性會失效
二:基本概念
采用flex布局的元素:容器
flex里的項目:子元素
兩條軸:main axis:水平的主軸
? ? ? ? ? ? cross axis:垂直的交叉軸
主軸開始的位置:main start
主軸結(jié)束的位置:main end
交叉軸開始的位置:main start
交叉軸開始的位置:main end
三:容器屬性
1.flex-direction
.box{
? flex-direction:屬性
}
屬性:
row默認主軸為水平方向程拭，起點在左端
row reverse默認主軸為水平方向，起點在左右端
column默認主軸為交叉軸方向棍潘，起點在左右端
column-reverse默認交叉軸為水平方向恃鞋，起點在左右端
2.flex-wrap
默認情況下，項目排在一條軸線亦歉，若排不下恤浪，如何換行
.box{
? ? ? flexwrap:屬性
}
屬性:nowrap不換行
wrap第一行在上方
wrap reverse第一行在下方
3.flex-flow
.box{
? ? flex-flow:<flex-direction><flex-wrap>
}
4.justify-content
.box{
? justity-content:屬性
}
屬性:flex-start
flex-end
center
space-between
space-around
5.align-items
.box{
? align-items:屬性
}
屬性:flex start
flex? end
center
baseline
strentch
6.align cotent
.box{
? ? align content:屬性
}
四:項目屬性
1.order定義項目排列順序肴楷，數(shù)值越小排列越靠前
2.flex grow
定義項目放大比例水由，默認為0，
3.flex shrink
定義項目縮小比例
.item{
? flex shrink<number>;
}
4.flex basis
定義分配多余空間之前赛蔫，項目所占的主軸空間
5.flex
.item{
? ? flex:none/flex grow/flex shrink/flex basis
}
6.align self
