将图像插入文本并使用CSS保持文本换行

Question

我刚遇到一个问题，即我当前（几乎等于0）的CSS知识无法处理。事情就是这样：

我在div元素中有一些文字;这个div元素（让我们称之为容器）具有固定的宽度和动态高度（没有约束）。我想在容器里放一些文字;在文字的第二个单词之后，我想放一个图像，这样整个事情看起来或多或少就像那样：

+---------------------+
| I was [x] on my way |
| to the city in the  |
| sun                 |
+---------------------+

其中[x]是图像。对文本的第二部分进行包装非常重要，以便所有内容都像上面的例子一样。

容器中的文字可能有所不同;尽管如此，我总是知道文本的哪一部分在此之前，文本的哪一部分在图像之后。

我如何用CSS做到这一点？

Answer 1

如果将<img>标记放在文本的中间，默认情况下应该表现如此，除非您覆盖图像的display属性。您可能还想尝试使用图片的vertical-align属性，以使其与周围文本很好地对齐。