如何用CSS实现左图右文?
我们现在来看CSS代码:
<style>
.block img {
float: left;
margin-right: 10px;
width: 100px;
height: 100px;
}
.block p {
width: 200px;
height: 100px;
line-height: 20px;
overflow: hidden;
}
</style>
可以看到我在这里定义了两个选择器,一个用来设置图片的位置,一个用来设置文本的位置。
html代码:
<div class="block">
<img src="img/杨楠.jpg"/>
<p>我哈哈哈哈哈哈哈哈哈哈哈嘿嘿哈哈哈哈哈哈</p>
</div>
这样就实现了简单的左图右文操作。