1，css calc()方法
calc()能让你给元素的做计算，你可以给一个div元素，使用百分比、em、px和rem单位值计算出其宽度或者高度，比如说“width:calc(50% + 2em)”，这样一来你就不用考虑元素DIV的宽度值到底是多少，而把这个烦人的任务交由浏览器去计算。
<style>
#div1 {width: calc(100% - 300px);border: 1px solid black;background-color: yellow;padding: 5px;text-align: center;
}
</style>
</head><body>
<p>创建一个横跨屏幕的div，div 两边有 50px 的间隙：</p>
<div id="div1">一些文本...</div>
2，flex布局
父元素要用flex，其中一个元素固定宽度，另一个元素自适应宽度用flex:1,适用于左边菜单固定，右边展示内容
<style type="text/css">.parent{display: flex}.son1{width: 300px;height: 200px;background-color: red;}.son2{flex:1;height: 200px;background-color: blue;}</style>
<div class="parent"><div class="son1"></div><div class="son2"></div></div>
