Flex布局:Flex布局
1、使用步骤如下：设置容器的display属性为flex或inline-flex。设置flex-direction属性决定主轴的方向。设置justify-content属性决定主轴上的子元素的对齐方式。设置align-items属性决定交叉轴上的子元素的对齐方式。设置flex-wrap属性决定是否换行。
2、Flex指的是弹性盒子布局（Flexible Box Layout），也叫做Flex布局，它是CSS3新增的一种布局方式。使用Flex布局可以让一块容器内的子元素按照一定的规则进行排列和布局，可以更加灵活地控制容器内子元素的排列顺序、对齐方式、间距等等。
3、Flex布局是一种CSS布局模型，它允许开发者在容器中轻松地控制和调整其内容。拓展知识：Flex布局提供了一种灵活的方式来排列和调整项目，使其在容器中具有响应性和适应性。它允许您控制项目的大小、位置和排列方式，使其适应不同的屏幕尺寸和设备。
4、Flex是FlexibleBox的缩写，意思是“灵活的布局”，用于为箱式模型提供最大的灵活性。任何容器都可以被指定为Flex布局。要使用flex布局，首先设置父容器display：flex，然后设置justify-content：center以实现水平居中，最后设置align-items：center以实现垂直居中。
5、首先，让我们深入了解Flex布局的六大核心属性： Flex容器的基石：flex-direction（重点）这个属性决定着主轴的方向，它像指挥棒一样，决定元素的排列顺序。默认情况下，主轴是从左到右的行（row），但你可以通过设置为column-reverse、column、row-reverse来改变方向。
如何通过flex进行网页布局
Flex容器的基石：flex-direction（重点）这个属性决定着主轴的方向，它像指挥棒一样，决定元素的排列顺序。默认情况下，主轴是从左到右的行（row），但你可以通过设置为column-reverse、column、row-reverse来改变方向。理解这一点，能让你的布局更为灵活多变。
使用CSS的flex布局齐。具体步骤如下：在HTML中，将导航栏和下方图片用div包裹起来，设置一个共同的容器。在CSS中，设置这个div容器的display属性为flex，让其成为一个弹性容器。设置flex-direction属性为column，让其成为一个垂直方向的弹性容器。
如何使用fiex进行响应式布局 使用fiex进行响应式布局主要是通过设置display：flex；将元素设置为伸缩容器。flefXbox布局的主要思想是赋予容器允许其子项改变宽度、高度（甚至顺序）的能力，以最佳方式填充可用空空间（主要是适应所有类型的显示设备和屏幕尺寸）。
对齐和间距控制：通过使用不同的属性和方法，可以控制弹性项目在主轴和交叉轴上的对齐方式、间距大小等，实现灵活的布局效果。排序和排序控制：可以通过设置不同的排序属性，改变弹性项目在弹性容器中的顺序，实现重新排序的效果。
使用步骤如下：设置容器的display属性为flex或inline-flex。设置flex-direction属性决定主轴的方向。设置justify-content属性决定主轴上的子元素的对齐方式。设置align-items属性决定交叉轴上的子元素的对齐方式。设置flex-wrap属性决定是否换行。
flex（flexible box：弹性布局盒模型），是 2009 年 w3c 提出的一种可以简洁、快速对页面进行弹性布局的属性。主要思想是给予容器控制内部元素高度和宽度的能力。目前已得到以下浏览器支持：其中在webkit内核的浏览器中使用时，必须加上 -webkit- 前缀。
微信小程序flex布局
1、使用步骤如下：设置容器的display属性为flex或inline-flex。设置flex-direction属性决定主轴的方向。设置justify-content属性决定主轴上的子元素的对齐方式。设置align-items属性决定交叉轴上的子元素的对齐方式。设置flex-wrap属性决定是否换行。
2、任何容器都可以使用flex布局 display： flex；行内元素可以使用flex布局 display： inline-flex；外层flex容器的属性：flex-direction属性 flex-direction： row | row-reverse | column | column-reverse；row（默认值）：主轴为水平方向，起点在左端。
3、上一章即微信小程序之view的flex布局（1）里，我们学习了flex容器的属性，总结一下它里面包括 （1）flex-direction 设置容器内子元素即flex-item的排列方向。 （2）flex-warp 设置容器内子元素是否换行。
flex有什么用?
Flex 是一个高效、免费的开源框架，可用于构建具有表现力的 Web应用程序，这些应用程序利用Adobe Flash Player和Adobe AIR， 运行时跨浏览器、桌面和操作系统实现一致的部署。
使用Flex布局可以让一块容器内的子元素按照一定的规则进行排列和布局，可以更加灵活地控制容器内子元素的排列顺序、对齐方式、间距等等。Flex布局特别适合移动端开发和响应式网站布局，它能够解决传统布局的很多缺点，比如说难以垂直居中、父子元素高度不同等问题。
flexes v.弯曲；伸缩；屈曲 n.花线；弯曲；弹性 用作动词 （v.）You face has 9 muscles beneath your skin that you contort ， flex ， and move.你的脸部皮肤下有9块可以扭曲、弯曲和运动的肌肉。The gardeners flexed their muscles and began to dig.园丁们舒腰展臂后才开始挖地。
标签： #弹性布局flex
