Style justifyContent 属性

阅读（0）
赞（0）
踩（0）
纠错

HTML DOM Style 对象

定义和用法

当项目未使用主轴（水平）上的所有可用空间时， justifyContent 属性对齐弹性容器的项目。

提示：请使用 alignContent 属性在横轴（垂直）上对齐项目。

另请参阅：

CSS 参考手册：justify-content 属性

实例

在弹性的 <div> 元素的项目之间留出一些空间：

document.getElementById("main").style.justifyContent = "space-between";

亲自试一试

语法

返回 justifyContent 属性：

object.style.justifyContent

设置 justifyContent 属性：

object.style.justifyContent = "flex-start|flex-end|center|space-between|space-around|initial|inherit"

属性值

值	描述
flex-start	默认值。项目位于容器的开头。
flex-end	项目位于容器的末端。
center	项目位于容器的中心。
space-between	在行间为项目留出空间。
space-around	在行前、行间和行后为项目留出空间。
initial	将此属性设置为其默认值。请参阅 initial。
inherit	从其父元素继承此属性。请参阅 inherit。

技术细节

默认值：	flex-start
返回值：	字符串，表示元素的 justify-content 属性。
CSS 版本：	CSS3

浏览器支持

Chrome	Edge	Firefox	Safari	Opera
Chrome	Edge	Firefox	Safari	Opera
支持	12.0	支持	9.0	支持

相关页面

HTML DOM STYLE 参考手册：alignContent 属性

HTML DOM STYLE 参考手册：alignItems 属性

HTML DOM STYLE 参考手册：alignSelf 属性

HTML DOM Style 对象