Html 如何使用CSS水平对齐图像旁边的文本

如何将图像旁边的文本与CSS（如附加的屏幕快照）垂直对齐

---

例：我在这篇文章中附上了screnshot。

将图像向左浮动，并在文本上放置

溢出：隐藏

，以防止其进入图像下方。

将此CSS样式用于图像

clear:both

---

一个简单的浮点数通常可以达到以下目的：

img {
    float: left;
}

p {
    float: left;
}

这使文本适应图像。如果文本的长度超过图像的高度，它将包裹在图像下。

Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它不仅存活了五个世纪，而且还跨越到电子排版，基本上保持不变

<p><img src="https://www.google.com/images/srpr/logo3w.png" style="float:left;padding-right:12px" width="280" />Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
<br style="clear:both" />
<p>It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>



它在20世纪60年代随着包含Lorem Ipsum段落的Letraset表单的发布而流行，最近随着Aldus PageMaker等桌面出版软件的发布，包括Lorem Ipsum版本

---

测试此项。

如果用户增加文本大小，此解决方案将切断文本。@NeilMasters仅在高度固定时切断文本。