2020.8.14

弹性布局

弹性布局的好处

 

能让元素对不同的屏幕尺寸和不同设备做出好的适应准备

 

弹性布局设置方式

在弹性依赖父子关系中设置

display:flex

设置主轴方向

设置flex-direction属性

主轴内容分布

justify-content属性

设置侧轴的分布

align-items属性

弹性布局中设置换行

flex-wrap属性

设置多行侧轴的分布

 

align-content

剩余空间分布设置

felx:1 占剩余份数的一份

flex2 占剩余份数的两份

子元素的排序问题

order属性将会按照order数字大小排序，按照从小到大排序

单独设置子元素侧轴排布

align-self

响应式

增加meta标签

 

媒体查询