HTML如何实现文字环绕图片

时间：2012-7-27

  大家肯定在各种图书，杂志和报纸上见过这种排版方式;一个图像出现在一栏文字中，文字绕开图像继续前行，就像水流绕过石头一身孕，在HTML的早期版本中，使用一种现在已经不用的align属性实现这种效果，但是现在可以用CSS中的float属性做同样的事。

  float属性有3种值：left,right,none.当一个元素“浮动”起来时，它会尽可能地向某一边（左边或者右边）移动，直到其（外）边缘碰到包含块的（内）边缘（或直到碰到另一个浮动元素），随后的文字或元素将绕开浮动元素向下流动，默认值none主要用于覆盖样式表中另一条规则给予元素的浮动属性。

  但是一般用了float排版后图片和文字是紧挨着的，在CSS代码中有必要加上与左或者右间距的代码，如:
.img{
  float:left;
  margin-right:10px;
  margin-bottom:10px;
}