html:
<style type="text/css">
div{background-color: #000;}
.div1,.div2{background-color: #ccc;float: left;width: 200px;color: #fff;}
}
</style>
<div style="float:left;overflow:hidden;">
<div class="item">
<div class="div1">
![](http://img.jpg)
</div>
<div class="div2">
<p>这是一段文字</p>
</div>
</div>
</div>
不固定高度时:div随着内容伸展:
修改后:
<style type="text/css">
div{background-color: #000;overflow: hidden;
}
.div1,.div2{margin-bottom: -100000px;padding-bottom: 100000px;
background-color: #ccc;float: left;width: 200px;color: #fff;}
}
</style>
<div style="float:left;overflow:hidden;">
<div class="item">
<div class="div1">
![](http://upload-images.jianshu.io/upload_images/1354453-7e9c3969c26c86ed.jpg@80Q?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
</div>
<div class="div2">
<p>这是一段文字</p>
</div>
</div>
</div>
效果图: