如何理解弹性盒子Flex的运用原理？

本文共计1917个文字，预计阅读时间需要8分钟。

认识弹性盒子flex，来源：https://blog.xybin.top/2022/flex+1、定义弹性布局（父级上定义）display:flex; 如果内核为webkit，则必须前面加上-webkit-flex 2、设置了弹性布局后，子元素的CSS中添加fl

认识弹性盒子flex

来源：blog.xybin.top/2022/flex

1、定义弹性布局（父级上定义）display:flex;
如果说内核为webkit 的必须前面加上 -webkit-flex

2、设置了弹性布局之后，子元素的css中的float, clear, vertical-align 这些属性将失效。

3、可以将flex弹性布局看成一个大盒子，也就是一个大容器，只要将它定义为 display:flex; 即它里面所有的子元素均自动成为容器的成员，专业术语称之为 项目

4、默认情况下，项目都是在容器里面水平排列的，即按照主轴排列，且是顺时针方向的。需（1,2,3）也就是x轴方向。