第一類：讓兩個塊級元素居于一行中

效果圖如下

第二類：讓兩個塊級元素居于一行的兩邊顯示

效果圖如下

第三類：讓一個塊級元素水平居中顯示

效果圖如下

第四類：讓一個塊級元素豎直居中顯示

效果圖如下

第五類：讓塊級元素水平豎直居中顯示

效果圖如下

第六類：讓左邊的塊級元素不變，右邊的塊級元素隨著視口變化而變化

效果圖如下

注意點：如果此處我寫的有誤，歡迎你指出來，謝謝。

第七類：讓子元素等寬大小

效果圖如下

關于flex布局之外，我們經常使用的文字居中有：

關于水平居中

效果圖如下

轉載于:https://www.cnblogs.com/smart-girl/p/9101364.html

總結

以上是生活随笔為你收集整理的关于flex布局，我大多数常用的几个点的全部內容，希望文章能夠幫你解決所遇到的問題。

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