容器内两部分,一部分固定宽度,一部分宽度自适应占满剩余位置
<div class='container'}> <div class='child1'/> <div class='child2'/> </div>
上面是html代码
方法一:flex
.container { display:flex; .child1 { flex;1; } .child2 { width: 200px; } }
方法二:c3计算属性
.container { .child1 { width: clac(100% - 200px); } .child2 { width: 200px; } }
方法三:设置盒子间距值
.container { .child1 { width: 100%; margin-right: 200px; } .child2 { width: 200px; } }