box flex flexbox比较

  box flexbox flex
year 2009 2011   2012
hack

-moz-box

-webkit-box

-o-box

-ms-flexbox -webkit-flex
parent

box-orient

box-direction

box-pack

box-align

flex-pack

flex-flow: direction wrap;

align-items  垂直排列

align-content  多列垂直排列

justify-content 水平排列

children

box-flex

box-ordinal-group

 

flex: flex-grow flex-shrink flex-basis

align-self

 

flex兼容性写法
  display: box;

  display: -webkit-box;

  display: -moz-box;

  display: -ms-flexbox;     

  display: -webkit-flex;

  display: flex;

*运用之后,float,vertical-align,clear会失效

posted @ 2017-07-04 20:53  夏目桑  阅读(390)  评论(0编辑  收藏  举报