CSS justify-content 屬性

CSS 參考手冊 CSS 參考手冊

實(shí)例

在彈性盒對象的 <div> 元素中的各項(xiàng)周圍留有空白：

div
{
display: flex;
justify-content: space-around;
}

嘗試一下 ?

瀏覽器支持

表格中的數(shù)字表示支持該屬性的第一個(gè)瀏覽器的版本號(hào)。

緊跟在 -webkit-, -ms- 或 -moz- 后的數(shù)字為支持該前綴屬性的第一個(gè)版本。

屬性          
justify-content 29.0
21.0 -webkit-		 11.0 28.0
18.0 -moz-		 9.0
6.1 -webkit-		 17.0

定義和用法

justify-content 用于設(shè)置或檢索彈性盒子元素在主軸（橫軸）方向上的對齊方式。

提示：使用 align-content 屬性對齊交叉軸上的各項(xiàng)（垂直）。

默認(rèn)值： flex-start
繼承： 否
可動(dòng)畫化： 否。請參閱 可動(dòng)畫化（animatable）。
版本： CSS3
JavaScript 語法： object.style.justifyContent="space-between"嘗試一下

CSS 語法

justify-content: flex-start|flex-end|center|space-between|space-around|initial|inherit;

屬性值

值 描述測試
flex-start 默認(rèn)值。項(xiàng)目位于容器的開頭。 測試 ?
flex-end 項(xiàng)目位于容器的結(jié)尾。 測試 ?
center 項(xiàng)目位于容器的中心。 測試 ?
space-between 項(xiàng)目位于各行之間留有空白的容器內(nèi)。 測試 ?
space-around 項(xiàng)目位于各行之前、之間、之后都留有空白的容器內(nèi)。 測試 ?
initial 設(shè)置該屬性為它的默認(rèn)值。請參閱 initial。 測試 ?
inherit 從父元素繼承該屬性。請參閱 inherit。  

相關(guān)文章

CSS 參考手冊：align-content 屬性

CSS 參考手冊：align-items 屬性

CSS 參考手冊：align-self 屬性


CSS 參考手冊 CSS 參考手冊