flexBox布局 -- 兼容性

 //中间留空，两侧靠边，多行显示，每行3个，一个li的宽度是30%，最后一行，如果是两个的时候会出现异常布局，可以对最后一行的最后一个li进行right:35%，android4.4以上才支持，
     所以说还需要通过混合box布局，但，如果需要多行显示，则android中不能实现，lines属性不支持，但在android4.2版本中，如果使用微信或者浏览器也还是可以的
 .title ul{
     list-style-type: none;
     position: relative;
     overflow: hidden;
     height: 48px//中间留空，两侧靠边
     display : -webkit-flex;
     -webkit-flex-direction : -webkit-row;
     -webkit-flex-wrap :  wrap;
     -webkit-justify-content : space-between;
     -webkit-align-item : -webkit-stretch;
     display : -moz-flex;
     -moz-flex-direction : -moz-row;
     -moz-flex-wrap :  wrap;
     -moz-justify-content : space-between;
     -moz-align-item : -moz-stretch;
     display : -ms-flex;
     -ms-flex-direction : -ms-row;
     -ms-flex-wrap :  wrap;
     -ms-justify-content : space-between;
     -ms-align-item : -ms-stretch;
     display : -o-flex;
     -o-flex-direction : -o-row;
     -o-flex-wrap :  wrap;
     -o-justify-content : space-between;
     -o-align-item : -o-stretch;
     display : flex;
     flex-direction : row;
     flex-wrap :  wrap;
     justify-content : space-between;
     align-item : stretch;;
     margin: 8px 0 0px 0;
 }

//可以使用另一种方式进行布局，3列多行布局

 .am-smallContainer ul li{
     width: 30%;
     text-align: center;
     border: 1px solid #ccc;
     height: 80px;
     margin: 8px 0;
     position: relative;
     border-radius: 2px;
     float: left;
     margin-right: 4.5%;
 }
 .am-smallContainer ul li:nth-child(3n){
     margin-right: 0;
 }
 .am-smallContainer ul li:first-child{
     margin-right: 4.5%;
 }