如何使用CSS让文字环绕图片(最多3面环绕)

HTML和CSS代码如下:

<html>
<head>
<style type="text/css">
img 
{
float:right;
clear:both;
}
</style>
</head>

<body>
<p>在下面的段落中,我们添加了一个样式为 <b>float:right</b> 的图像。结果是这个图像会浮动到段落的右侧。</p>

<div style="width:0px;height:20px;float:right"></div>
<img src="/i/eg_cute.gif" />
<p>
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</p>
</body>

</html>  

 

效果如下:

测试地址:

http://www.w3school.com.cn/tiy/t.asp?f=csse_float

 

posted @ 2018-10-09 14:43  jim520  阅读(3124)  评论(0编辑  收藏  举报