前端web-flex布局

flex布局

• • 百分比布局
  • FLex布局

百分比布局

特点

1. 流式布局;
2. 宽度自适应，高度固定

布局方式

宽度为半分比写法

FLex布局

Flex的优势和特点

1. 浏览器提倡的布局模型，页面渲染性能高
2. 布局简单、方便
3. 避免浮动脱标的问题
4. 兼容性较高（不兼容低版本浏览器）

组成部分

1. 弹性容器（父级， 添加display:flex的盒子）
2. 弹性盒子（子级）
3. 主轴（默认水平）
4. 侧轴（默认垂直）

主侧轴对齐方式

1. 主轴
   
2. 侧轴

弹性伸缩比

1. flex: 整数数字;
2. 占用父级剩余尺寸的份数

标签：FLex,侧轴,父级,web,前端,布局,flex,浏览器
来源： https://blog.csdn.net/TroyeSivanlp/article/details/120229901