Flex是Flexible Box的缩写,意为“弹性布局”。
采用 Flex 布局(display: flex;
)的元素,称为 Flex 容器(flex container),简称"容器"。它的所有子元素自动成为容器成员,称为 Flex 项目(flex item),简称"项目"。
![](https://img.haomeiwen.com/i807748/c69be61848a96371.png)
![](https://img.haomeiwen.com/i807748/e59b4ff388d5303b.png)
Flex 布局的主要思想是使父容器能够调节子元素的宽度/高度(和排列顺序),从而能够最好地填充可用空间。
- Flexbox布局最适合应用程序的组件和小规模布局,而 Gird 布局则适用于较大规模的布局。
- 设为Flex布局以后,子元素的float、clear和vertical-align属性将失效。
网友评论