- /* 子元素 - 平均分栏 */
- .flex1 {
- -webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */
- -moz-box-flex: 1; /* OLD - Firefox 19- */
- width: 20%; /* For old syntax, otherwise collapses. */
- -webkit-flex: 1; /* Chrome */
- -ms-flex: 1; /* IE 10 */
- flex: 1; /* NEW, Spec - Opera 12.1, Firefox 20+ */
- }
- /* 父元素 - 横向排列 (主轴) */
- .flex-h {
- display: box; /* OLD - Android 4.4- */
- display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
- display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
- display: -ms-flexbox; /* TWEENER - IE 10 */
- display: -webkit-flex; /* NEW - Chrome */
- display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
- /* 09 版 */
- -webkit-box-orient: horizontal;
- /* 12 版 */
- -webkit-flex-direction: row;
- -moz-flex-direction: row;
- -ms-flex-direction: row;
- -o-flex-direction: row;
- flex-direction: row;
- }
来源: http://www.qdfuns.com/article/16548/1a619117375f89cf27818000ec271185.html