简述下Flex的容器和项目的概念

在Flex布局中，有两个关键概念：容器和项目。

• 容器 (Container): 指应用了display: flex 或 display: inline-flex 的元素。它是Flex项目的父元素，控制着项目的布局和排列方式。容器通过一系列属性来定义其子项目如何排列，例如：flex-direction、justify-content、align-items、flex-wrap 等。

• 项目 (Item): 指容器的直接子元素。它们会根据容器设置的属性进行排列。每个项目也可以通过自身的属性来微调其在容器中的行为，例如：flex-grow、flex-shrink、flex-basis、align-self、order 等。

简单来说，可以将容器想象成一个盒子，而项目就是盒子里的物品。容器决定了盒子的大小和物品的排列方式，而项目则可以调整自身在盒子里的位置和大小。