Question

CSS如何设置自动大小和固定大小？

这样的效果：
<div style="width: 20%;height: 100%;float: left;background-color: Red;"></div>
<div style="width: 80%;height: 100%;float: left;background-color: Black;"></div>

但是我想要第一个div宽度固定200像素同时改变浏览器大小的时候第二个DIV会自动改变大小，这样的话：
<div style="width: 200px;height: 100%;float: left;background-color: Red;"></div>
<div style="width: 80%;height: 100%;float: left;background-color: Black;"></div>
第二个DIV就出问题了，它应该是宽度100% - 200px，怎么才能做到呢

Answer 1

很好处理啊，
第一个div你设定float: left;width: 200px;
第二个div你却不一定非要加;float: left; 并排可以用其他方法的
第二个div你可以设margin-left:200px; 因为div默认是最大宽度，所以浏览器宽度改变的时候，第二个div宽度也就会改变，举例如下：
<div style="width: 200px;height: 100%;float: left;background-color: Red;"></div>
<div style="margin-left:200px; height: 100%;background-color: Black;"></div>

还有另一个方法：
<div style="width: 200px;height: 100%;float: left;background-color: Red;"></div>
<div style=" overflow:hidden; height: 100%;background-color: Black;"></div>

Answer 2

比如div如果是高度的话，里面的内容有多高div就有多高，默认的是自动高度，如果设置固定高度为某个值，超过这个值就会出现滚动条

Answer 3

先定义html,body{height:100%}

再设置img{height: 百分比}

就可以了

Answer 4

<div style="width: 200px;height: 100%; float: left;background-color: Red;"></div>
<div style="background-color:#ff1; margin-left:200px;"></div>

margin-left:200px