flex布局和傳統的布局有什么不同

flex布局和傳統的布局有什么不同？

傳統布局：基于盒模型，依賴 display屬性 、position屬性 、float屬性；

flex布局：flex 是 flexible Box 的縮寫，意為”彈性布局”，用來為盒狀模型提供最大的靈活性。

（推薦教程：css快速入門）

設為display:flex的元素稱為"容器"，它的子元素稱為"項目"。需要注意的是，容器設為 flex 布局以后，子元素的float、clear和vertical-align屬性將失效；

為什么要確定主軸和側軸？

主軸和側軸是通過flex-direction確定的(默認是row) 之所以要確定主軸，是因為要確定項目的對齊方向：

如果flex-direction是row或者row-reverse，那么主軸就是justify-content；

如果flex-direction是column或者column-reverse,那么主軸就是align-items.