flex实现自适应页面

Flex布局是一种相对布局模式，它通过flex容器和flex项目两个概念来组成。在flex容器中，我们可以通过设置容器的属性来控制项目的排列方式，包括主轴方向、对齐方式、换行方式等。而在flex项目中，我们可以通过设置项目的属性来控制项目的大小、顺序、对齐方式等。

使用Flex布局可以实现页面自适应，因为Flex布局可以自动适应不同屏幕尺寸和不同设备的浏览器窗口大小。需要注意以下几点：

1. 设置flex容器的属性：设置容器的display为flex，同时设置flex-wrap为wrap；

2. 设置flex项目的属性：设置项目的flex-grow、flex-shrink和flex-basis，分别表示项目的放大比例、缩小比例和基准大小。

3. 使用媒体查询：根据设备不同，采用不同的布局方案。

通过以上步骤，就可以使用Flex布局实现页面的自适应，从而适应不同屏幕尺寸、不同设备的浏览器窗口大小。这种布局方式简单、灵活，可以让Web开发人员更便捷地实现页面的自适应，提高网站的用户体验和可访问性。