justify-content

CSS justify-content 属性定义浏览器如何沿着弹性容器的主轴和网格容器的行向轴分配内容元素之间和周围的空间。

Syntax

justify-content: center | flex-star | flex-end | space-between | space-around;

Values

center 元素紧密地排列在主轴方向居中对齐

flex-start 元素紧密地排列在容器主轴起始侧

flex-end 元素紧密地排列在容器主轴结束侧

space-between 在主轴上均匀分配元素。相邻元素间距离相同。第一个元素与主轴首对齐，最后一个元素与主轴尾对齐

space-around 元素沿着主轴均匀分布在容器中。相邻项之间的间距，主轴起始位置到第一个元素的间距，主轴结束位置到最后一个元素的间距，都完全一样

default

Platform	default
app-uvue	flex-start
web	normal

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
justify-content	5.0	√	3.9+	9.0	√	-

See also

• Related Bug