一栏固定宽度，一栏自适应
方法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;}
浏览器兼容性不好，不推荐使用！！！
