NEC学习 ---- 布局 -三列,左侧自适应

效果图:

NEC学习 ---- 布局 -三列,左侧自适应

html代码:

<div id="demo4">
<div class="g-bd4 f-cb">
<div class="g-sd41">
<p>右侧定宽1</p>
</div>
<div class="g-sd42">
<p>右侧定宽2</p>
</div>
<div class="g-mn4">
<div class="g-mn4c">
<p>左侧自适应</p>
</div>
</div>
</div>
</div>

CSS代码:

#demo4{
width:980px;margin:auto;
margin-top: 45px;
}
.g-bd4{
border:1px solid black;
}
.g-sd41,.g-sd42{
position: relative;float: right;width:230px;
}
.g-sd42{
width:190px;margin-right: 10px;
}
.g-mn4{
float: left;width:100%;margin-right: -430px;
}
.g-mn4c{
margin-right:440px;
}
.g-bd4 p{
padding:5px;background-color: #034888;
height:140px;
}

Done :)

上一篇:End up with More Teams UVA - 11088


下一篇:pdfium 代码执行流程