彈性佈局也叫flex佈局，flex是flex box的縮寫，意為彈性佈局或彈性盒子，是css3中的一種新的佈局模式，適用於適應不同螢幕大小以及不同裝置型別。目前，幾乎所有的瀏覽器都支援Flex佈局。

·基本概念

採用 Flex 佈局的元素，稱為 Flex 容器（flex container）。它的所有子元素自動成為容器成員，稱為 Flex 專案（flex item）。容器預設存在兩根軸，分別為水平的主軸（main axis）和垂直的交叉軸（cross axis）。主軸的開始位置叫做 main start，結束位置叫做 main end；交叉軸的開始位置叫做 cross start，結束位置叫做 cross end。專案預設沿主軸排列。單個專案佔據的主軸空間叫做 main size，佔據的交叉軸空間叫做 cross size。如下圖所示：

ps:可以通過將元素的display屬性設定為flex或者inline-flex。當一個元素設定了flex佈局以後，他子元素的float、clear等屬性將失效。

·CSS中通過以下屬性來實現Flex佈局