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.

以上是flex佈局和傳統的佈局有什麼不同的詳細內容。更多資訊請關注PHP中文網其他相關文章！