本文不是一篇入门的文章所有请符合以下条件的战斗人员绕道:
1、初学前端,对前端的传统布局还不是很熟悉的人
2、后端人员对前端不打算深入学习的同学
二、开篇
flex布局原本是好几个月前就一直想学习的东西,当时flex布局还算是比较新鲜的玩意,转眼间flex布局已经不再新鲜,而且这些年,随着浏览器对ES6的支持情况日益增强,使得我们越来越有必要去学习一下怎样去使用好flex布局,废话我也就不多说了,我们就直奔主题吧
三、何为flex
说到什么是flex这里就引用以下阮一峰老师的定义
布局的传统解决方案,基于盒状模型,依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。
我认为flex布局最大的优势就是在其的“弹性”,“弹性”主要表现在flex布局不同于盒子模型的百分比布局和CSS3支持的响应式布局,以下有几种情况是盒子模型中的这些布局所不便实现的:
1、浏览器的视口空间不足,要求视口中的特定块要按照比例进行缩放
2、应对一些布局是要以基准线(baseline)对齐的特殊布局方法
3、需要模块垂直居中
网友评论

