html - 如何使图像允许文本在 HTML 中环绕它？

Question

我正在创建我的第一个站点，它在此处在线发布：链接到我的站点

但是，您可以看到 UL（列表）或任何其他文本位于新行上，而不是与图像并排。我认为它应该在同一行，因为它在同一个标​​签中，但事实并非如此。

怎么修？

Answer 1

使用floatCSS 属性。这实际上是float财产的最初目的。

例如：

img#yourImage {
    float: left;
}

不要忘记在clear您应用float. 或者，您可以在使用clear创建的“虚拟”元素上使用:after.

更新：这个网站实际上提供了一个很好的解释和例子。

Answer 2

将此CSS添加到ul.favourites

display: inline-block;
vertical-align: top;

我个人更喜欢这个float:left。我希望这有帮助！