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

Posted 2023-02-28

这样的效果： <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，怎么才能做到呢

参考技术A 很好处理啊，
第一个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>