css布局实现左侧固定右侧自适应的4种方式
我们在左右布局的时候经常会碰到左侧宽度需要固定,右侧宽度自适应的场景,那么通过css怎么实现呢,下面介绍4种方式来实现这种效果。
一、浮动
<div class="content" > <div style="float: left;"></div> <div style="margin-left: 50px;"></div> </div> <style> .content { width: 100%; height: 50px; border: solid 1px; margin-top: 10px; } .content div:first-child { background: red; height: 50px; width: 50px; } .content div:last-child { background: green; height: 50px; } </style>
二、绝对定位
<div class="content"> <div style="position: absolute"></div> <div style="overflow:hidden;"></div> </div> <style> .content { width: 100%; ...
点击查看剩余70%
网友评论0