Question

我正在尝试使用一些文字来包装图像：

http://69.143.137.155/csa-consulting/

查看毕业帽的图片？我试图将它旁边的文本放在渐变帽的右边（即使是顶部），直到它比图像长，然后才能使用整个空间。

有什么想法吗？

谢谢！

Answer 1

将图像浮动。

.someclass
{
   float: left;
}

Answer 2

我真的不明白你所说的部分（即使是顶部），但我建议的是将float：left样式包含在你的图像中，

<img src="images/grad_cap.jpg" style='float:left' />

记得清楚：在下一个元素处都确保一切都重置为正常。例如

<div style='clear:both' />

这里有一个非常好的教程，为您提供所需内容的逐步演练，http://css.maxdesign.com.au/floatutorial/

问候，
安迪。

Answer 3

<div style="overflow:auto">
       <div style="float:left;">
          <img src="#" style="margin-right:10px;"/>
       </div>
       <div style="float:right;">
           text goes here.
       </div>
</div>

CSS浮动将达到您想要的效果。父元素上的溢出自动'清除'浮动，以便容器的基础扩展到两个子元素的高度（它实现与clear相同：两者）。

如果你想在图像和文本之间留一些空间，可以在图像上放置一些边距/填充，或者定义左边的宽度，右边浮动的div以允许一些空间。

（通过在图像上放置边距/填充，而不是浮动的div，可以避免Internet Explorer 6错误，其中浮动元素的边距加倍。）

文字环绕图像

3 个答案: