flex佈局，父元素設定樣式display:flex，左右元素設定寬度(如width:100px)，中間設定樣式flex:1即可！

對於左右定寬中間自適應這種css佈局，其實有很多實現方法，下面簡單介紹幾種，供大家參考；

原理是將左右兩邊的div使用絕對定位分別定位到左右兩邊，中間的div使用margin屬性，留出左右div的寬度，將其中間的div寬度設為100%即可，程式碼如圖

在外層包一層div，設定屬性display：flex，裡面的子元素設定屬性flex:1,具體實現，看下圖程式碼

float佈局將左右div分別浮動到左右，中間使用margin屬性，留出左右的寬度，這個跟絕對定位佈局有點相似，程式碼如下圖

效果圖：總結：

最簡單的，左右浮動脫離文件流，中間的自然會佔住左右兩個浮動元素位置，再設定中間元素外邊距為左右浮動元素寬度即可。