首页 > 代码库 > css布局之左右固定宽度中间自适应
css布局之左右固定宽度中间自适应
方法一：
左右布局用float,中间布局以左右布局的宽度为margin,这样就能自适应了。
左：float:left;width:300px;
右：float:right;width:300px;
中间：margin:0 300px;
方法二：
左右布局用position,中间布局以左右布局的宽度为margin,这样就能自适应了。
左：position:absolute; left:0; top:0width:300px;
右：position:absolute; top:0; right:0;width:300px;
中间：margin:0 300px;
方法三：
<style>.demo3{ margin-top: 30px;}.demo3 .l,.demo3 .r,.demo3 .m{ float: left;}.demo3 .l,.demo3 .r,.demo3 .in{ height: 300px;}.demo3 .m{ width: 100%;}.demo3 .in{ margin: 0 300px; background:#fcc;}.demo3 .l{ width: 300px; margin-left: -100%; background:#9CF;}.demo3 .r{ width: 300px; margin-left: -300px; background:#ccc;}</style><div class="demo3"> <div class="m"> <div class="in"></div> </div> <div class="l"></div> <div class="r"></div></div>
css布局之左右固定宽度中间自适应
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。