Flexbox

一、从"痛苦的浮动"到"丝滑的弹性"1.1 回到那个用 float 布局的年代在 Flexbox 诞生之前，CSS 布局主要依赖 float 和 position。这些属性最初并非为复杂布局设计——float 的本意是让文字环绕图片。 但前端开发者硬是用它们做出了多栏布局、导航栏、卡片网格……代价是各种 hack 技巧： 123456789101112131415161718/* 旧时代的"圣杯布局"——每个前端都经历过 */.left { float: left; width: 200px;}.right { float: right; width: 200px;}.main { margin: 0 200px; /* 避开左右浮动元素 */}/* 还得写 clearfix 清除浮动…… */.clearfix::after { content: ""; display: table;...