在这里插入图片描述
<!--假设高度已知,写出三栏布局,其中左栏、右栏宽度各位300px,中间自适应-->
<section class="layout float">
<style type="text/css">
.layout article div{
min-height: 100px;
}
.layout.float .left{
float: left;
width: 300px;
background: red;
}
.layout.float .right{
float: right;
width: 300px;
background: blue;
}
.layout.float .center{
background: yellow;
}
</style>
<article class="left-right-center">
<div class="left"></div>
<div class="right"></div>
<div class="center">
<h1>浮动解决方案</h1>
1.这是三栏布局
2.这是中间部分
</div>
</article>
</section>