1. 程式人生 > >自適應佈局,完美解決左右兩邊固定大小,中間內容適應大小。

自適應佈局,完美解決左右兩邊固定大小,中間內容適應大小。

自適應佈局,左右兩邊固定大小,中間內容適應大小

如圖所示,需要把上面的Chinese Cosmetic和 更多 、搜尋 分別固定在左右兩側,嘗試過很多辦法,後來用絕對定位absolute 擁有拉伸的特性完美解決。

程式碼分析,

Chinese Cosmetic 寬度200px,左浮動。

更多 、搜尋 寬度80px,右浮動。

中間的品牌和公司簡介,分別設定絕對定位absolute,left:200 px,right:80px。

然後把品牌和公司簡介的寬度分別設定成 50%。

即可完美自適應佈局!!!!!