一欄固定寬度，一欄自適應
方法1
左側float:left，右側margin-left。
.left{float: left;width: 200px;}
.right{margin-left: 200px;}
浮動的元素是在頁面中脫離文檔流，沒有了自己的位置，所以後面的元素被浮動的元素覆蓋，通過margin撐開。
方法2
左側float:left，右側overflow:hidden。
.left{float: left;width: 200px;}
.right{overflow:hidden;}
具有BFC特性的元素可以看作是隔離了的獨立容器，容器裏面的元素不會在佈局上影響外面的元素，並且BFC具有普通元素沒有特性：如下邊距不發生摺疊；可以清除浮動；可以阻止元素被覆蓋。
正因爲有了這些特性，所以右邊可以用觸發BFC的元素來清除左邊浮動的影響。
如何形成BFC
1.float爲left，right2.position爲fixed和absolute3.display爲flex，inline-flex，table，table-cell，table-caption，inline-block4.overflow爲auto，scroll，hidden
所以除了設置overflow:hidden我們還可以設置下面的任意一種
1.overflow: auto2.overflow: scroll3.display: flex
方法3
利用定位
.wrap{position: relative; }
.left{ width: 200px; }
.right{ position: absolute; top: 0; left: 200px; right: 0}
方法4
利用彈性佈局flex
.wrap{display: flex;}
.left{width: 200px;}
.right{flex: 1;}
推薦使用
方法5
grid網格佈局
.wrap{display: grid;grid-template-columns: 200px auto;}
瀏覽器兼容性不好，不推薦使用！！！
