flex-direction

CSS flex-direction 属性指定了内部元素是如何在 flex 容器中布局的，定义了主轴的方向 (正方向或反方向)。

Syntax

flex-direction: row | row-reverse | column | column-reverse;

Values

row flex 容器的主轴被定义为与文本方向相同。主轴起点和主轴终点与内容方向相同。

row-reverse 表现和 row 相同，但是置换了主轴起点和主轴终点

column flex 容器的主轴和块轴相同。主轴起点与主轴终点和书写模式的前后点相同

column-reverse 表现和column相同，但是置换了主轴起点和主轴终点

default

Platform	default
app-uvue	column
web	row

Applicable components

• view
• scroll-view
• list-view
• list-item
• swiper-item
• navigator

Compatibility

uni-app compatibility

	Android version	Android uni-app	Android uni-app-x	iOS version	iOS uni-app	iOS uni-app-x
flex-direction	5.0	√	3.9+	9.0	√	-

See also

• MDN Reference
• Related Bug