多列等分布局
2020-04-29 本文已影响0人
考拉程序媛
实用float实现
.parent{margin-left:-20px}/假设列之间的间距为20px/
.column{float:left;width:25%;padding-left:20px;box-sizing:border-box;}
利用table实现
.parent-fix{margin-left:-20px;}
.parent{display:table;table-layout:fixed;width:100%;}
.column{display:table-cell;padding-left:20px;}
利用flex实现
.parent{display:flex;}
.column{flex:1;}
.column+.column{margin-left:20px;}