将图像与文本一起使用答案

【问题标题】：use image along with text将图像与文本一起使用
【发布时间】：2012-12-02 09:37:36
【问题描述】：

我在这里遇到了一个很小的基本问题。我有一张图片和很多文字。我希望我的图像占据它的空间，然后剩余的空间应该用文本填充，也是图像右侧的空间。但是，文本总是从图像结束的下一行开始。这是代码。

<p style="float:left;">
  <img src="http://upload.wikimedia.org/wikipedia/commons/b/b1/Maria_Amalia.jpg" />
Princess Maria Amélia of Brazil (1831–1853) was the daughter of Dom Pedro I, founder of Brazil's independence and here continues my text...</p>

Jssfiddle：http://jsfiddle.net/xpncr/

【问题讨论】：

HTML5 中有一个不错的新 figure 标签及其伙伴 figcaption，在这里可能更合适。

标签： html css web-applications

【解决方案1】：

你想在你的图片上加上float: left。

<p>
    <img src="http://upload.wikimedia.org/wikipedia/commons/b/b1/Maria_Amalia.jpg" style="float: left;" />
    Princess Maria Amélia of Brazil (1831–1853) was the daughter of Dom Pedro I, founder of Brazil's independence and
</p>

Jsfiddle：http://jsfiddle.net/xpncr/1/

【讨论】：

@3dgoo +1 投票比我打字快：D