在CSS3中，flex模塊作為一種新的布局方式被引入，它可以幫助我們更加高效和靈活地構建網頁布局。其中，justify-content屬性是其中一個很重要的組成部分。

.container {
display: flex;
justify-content: center;
}

上述代碼中，我們通過設置父元素的display: flex來開啟flex布局，并且使用justify-content: center來讓子元素在水平方向上居中對齊。

justify-content屬性還支持其他的取值，其中比較常用的有：

• flex-start：默認值，子元素在主軸起點對齊。
• flex-end：子元素在主軸終點對齊。
• space-between：平均分配主軸上的空白間隔，子元素同樣分布在主軸上。
• space-around：和space-between類似，但是首尾兩個子元素和父元素之間的間距是其他子元素間距的一半。
• space-evenly：平均分配主軸上的空白間隔，包括首尾兩個子元素和父元素之間的間距。

.container {
display: flex;
justify-content: space-between;
}

上述代碼中，我們再次使用父元素的display: flex開啟flex布局，并將justify-content屬性設置為space-between，從而讓子元素之間在主軸上平均分布。

總體來說，flex布局可以極大地提高我們布局的靈活性和效率，而justify-content屬性則可以幫助我們更好地管理子元素在主軸上的布局方式。同理，align-items和align-content屬性則分別用于在副軸方向上管理子元素的布局方式，可以同樣值得我們深入探究。