这篇文章给大家分享的是有关微信小程序中Flex布局是什么意思的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
Flex是灵活的盒子的缩写,意为“弹性布局“,用来为盒状模型提供最大的灵活性。
任何一个容器都可以指定为Flex布局。
行内元素也可以使用Flex布局。
Webkit内核的浏览器,必须加上Webkit前缀。
注意,设为Flex布局以后,子元素的浮动,清晰和vertical-align属性将失效。
Flex基本概念
采用Flex布局的元素,称为Flex容器(Flex容器),简称“容器“。它的所有子元素自动成为容器成员,称为Flex项目(Flex项目),简称“项目“。
容器默认存在两根轴:水平的主轴(主轴)和垂直的交叉轴(横轴)。主轴的开始位置(与边框的交叉点)叫开始,主要做结束位置叫做主要结束;交叉轴的开始位置叫做交叉开始,结束位置叫做交叉。
项目默认沿主轴排列。单个项目占据的主轴空间叫做主要尺寸,占据的交叉轴空间叫做交叉大小。
容器的属性
?flex-direction:属性决定主轴的方向(即项目的排列方向)。(左中右,,上中下)
?flex-wrap:属性定义,如果一条轴线排不下,如何换行。
?flex-flow: flex-direction属性和flex-wrap属性的简写形式,默认值为行nowrap
} ?justify-content:属性定义了项目在主轴上的对齐方式。(左中右)
?对齐项目:属性定义项目在交叉轴上如何对齐。(上中下)
?align-content:属性定义了多根轴线的对齐方式。如果项目只有一根轴线,该属性不起作用。
感谢各位的阅读!关于“微信小程序中Flex布局是什么意思”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!
