css实现文字环绕图片的效果

发布时间:2020-10-26编辑:脚本学堂
在做布局的过程中常常遇到文字围绕图片的效果。如何用css实现文字环绕图片的效果?其实很简单,就是图片浮动位置的调整。

例子,css 文字环绕图片效果。
 

复制代码 代码示例:

<!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">
<style>
div {
  width:300px;
  height:200px;
  border:1px solid red
  }
img {
  float:left;
  width:100px;
  height:100px
  }
</style>
<div>
<img src="/images/default/logo.gif" />
我要实现左上角是图片,然后就是文字环绕在图片的右边,像下面的效果图一样。我要实现左上角是图片,然后就是文字环绕在图片的右边,

像下面的效果图一样。我要实现左上角是图片,然后就是文字环绕在图片的右边,像下面的效果图一样。我要实现左上角是图片,然后就是文

字环绕在图片的右边,像下面的效果图一样。我要实现左上角是图片,然后就是文字环绕在图片的右边,像下面的效果图一样。我要实现左上

角是图片,然后就是文字环绕在图片的右边,像下面的效果图一样。
</div>