flex-direction：

flex-wrap：

justify-content:

align-items：

align-content：

display：flex；

可以填入兩個值： inline-flex、flex(flex用到的比較多)

給父級設置display：flex；這個父級就變成了一個具備彈性功能的盒子區域，在這個區域里面我們就可以使用它的功能，父子級相互配合使用。

flex-direction：

flex還有兩條軸，一個是主軸(X軸)還有交叉軸(Y軸)

可以填入4個值：row | row-reverse | column | column-reverse

row：默認方向，即主軸由左往右

row-reverse：對齊方式與row相反。

column：即縱向主軸從上往下排列(頂對齊)。

column-reverse：對齊方式與column相反。

flex-wrap

可填入3個值：nowrap | wrap | wrap-reverse

nowrap是默認值

wrap：f

總結

以上是生活随笔為你收集整理的html盒子模型子元素怎么水平占满父元素_CSS3——弹性盒模型-flex——父级属性...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。