flex布局和傳統(tǒng)的布局有什么不同？

傳統(tǒng)布局：基于盒模型，依賴(lài) display屬性 、position屬性 、float屬性；

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

（推薦教程：css快速入門(mén)）

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

為什么要確定主軸和側(cè)軸？

主軸和側(cè)軸是通過(guò)flex-direction確定的(默認(rèn)是row) 之所以要確定主軸，是因?yàn)橐_定項(xiàng)目的對(duì)齊方向：

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

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