Question

如何通过css实现文字可以围绕图片而不另起一行？

在一个网页中插入一个图片，然后写一些文字，如何实现文字紧跟图片的右上角展开，而不是在图片下方开始？类似效果是：

而我现在实现的效果是：

如何实现呢？奋斗一上午了，还没有实现。





Answer 1

有好几种办法啊，如果你的图片和文字都是行内元素，就这样
css代码：
.pic,.text{ vertical-align:top;}
html代码：
<div>
<img class="pic" src="a.jpg" width="110" height="140" alt="" />
<span class="text">这是一张图片这是一张图片这是一张图片这是一张图片</span>
</div>

如果文字是块级元素就这样：
css代码：
.pic{ float:left; width:110px; height:140px;}
.text{ margin-left:110px;}
html代码：
<div>
<img class="pic" src="a.jpg" width="110" height="140" alt="" />
<p class="text">这是一张图片这是一张图片这是一张图片这是一张图片</p>
</div>

Answer 2

在图片里面加左浮动,也就是
<img src="" style="float:left" />