原文:任意分栏布局 Any Order, Any Layout Columns

二分栏:百分比宽度

m,s:100%

①. Main 栏宽100%
②. Sub 栏宽100%

m:50% | s:50%

①. Main 栏宽50%
②. Sub 栏宽50%

s:50% | m:50%

①. Main 栏宽50%
②. Sub 栏宽50%

m:66% | s:33%

①. Main 栏宽66%
②. Sub 栏宽33%

s:66% | m:33%

①. Main 栏宽33%
②. Sub 栏宽66%

m:33% | s:66%

①. Main 栏宽33%
②. Sub 栏宽66%

s:33% | m:66%

①. Main 栏宽66%
②. Sub 栏宽33%

二分栏:一栏定宽,另一栏自适应

m:200px | s:auto

①. Main 栏宽200px
②. Sub 栏宽度自适应

s:200px | m:auto

①. Main 栏宽度自适应
②. Sub 栏宽200px

m:auto | s:200px

①. Main 栏宽度自适应
②. Sub 栏宽200px

s:auto | m:200px

①. Main 栏宽200px
②. Sub 栏宽度自适应

三分栏:百分比宽度

m,s,e:100%

①. Main 栏宽100%
②. Sub 栏宽100%
③. Extra 栏宽100%

s:25% | m:50% | e:25%

①. Main 栏宽50%
②. Sub 栏宽25%
③. Extra 栏宽25%

e:25% | m:50% | s:25%

①. Main 栏宽50%
②. Sub 栏宽25%
③. Extra 栏宽25%

m:25% | s:50% | e:25%

①. Main 栏宽25%
②. Sub 栏宽50%
③. Extra 栏宽25%

m:25% | e:50% | s:25%

①. Main 栏宽25%
②. Sub 栏宽25%
③. Extra 栏宽50%

s:25% | e:50% | m:25%

①. Main 栏宽25%
②. Sub 栏宽25%
③. Extra 栏宽50%

e:25% | s:50% | m:25%

①. Main 栏宽25%
②. Sub 栏宽50%
③. Extra 栏宽25%

三分栏:左右栏定宽,中间栏自适应

s:200px | m:auto | e:200px

①. Main 栏宽度自适应
②. Sub 栏宽200px
③. Extra 栏宽200px

e:200px | m:auto | s:200px

①. Main 栏宽度自适应
②. Sub 栏宽200px
③. Extra 栏宽200px

三块二分栏:

m,e:auto | s:200px

①. Main 栏宽度自适应
②. Sub 栏宽200px
③. Extra 栏宽度自适应

s:200px | m,e:auto

①. Main 栏宽度自适应
②. Sub 栏宽200px
③. Extra 栏宽度自适应

二分栏结构,两层布局嵌套

m:50% | s:50%

①. Main 栏宽50%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽50%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应

s:50% | m:50%

①. Main 栏宽50%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽50%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应

m:66% | s:33%

①. Main 栏宽66%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽33%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应

s:66% | m:33%

①. Main 栏宽33%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽66%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应

m:33% | s:66%

①. Main 栏宽33%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽66%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应

s:33% | m:66%

①. Main 栏宽66%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽33%
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应

m:200px | s:auto

①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应

s:200px | m:auto

①. Main 栏宽度自适应
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽200px

m:auto | s:200px

①. Main 栏宽度自适应
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应
②. Sub 栏宽200px

s:auto | m:200px

①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽100%
②. Sub 栏宽100%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽50%
②. Sub 栏宽50%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽33%
②. Sub 栏宽66%
①. Main 栏宽66%
②. Sub 栏宽33%
①. Main 栏宽200px
②. Sub 栏宽度自适应
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽度自适应
②. Sub 栏宽200px
①. Main 栏宽200px
②. Sub 栏宽度自适应