html - Position:不推送附近文字的相对图片？

Question

简单的问题:我需要一个图像出现在一段文本的中间，但是图像比每行字体的高度略大，所以它在文本中推开了一个水平“间隙”为自己腾出空间。要解决此问题，我可以:

1) 缩小图像，使其不大于字体。2)使用Position:Absolute

但我不想进一步缩小它，它已经足够小，可以“技术上适合”每行文本，除了它需要用完上面和下面的白色区域的几个像素它所在的文本行。

而且我不能使用 position:absolute，因为这样图像的位置将位于窗口的左上角，而不是我想要的段落中。

我想也许我可以在段落中放入一个大小为 1 像素的虚拟“占位符”图像。然后，在我的真实图像上使用 Position:Absolute，并不断将我的真实图像设置在与虚拟图像相同的位置。我还没有研究过这是否可能，但对于这么简单的事情来说似乎有点过分了。有没有更简单的方法？

编辑:我发现添加:margin:-20px;图像的风格有效!!!

margin:-20px;

JSFiddle 示例:http://jsfiddle.net/j7tLX/3/

Answer 1

如果您希望图像与段落内联显示，则图像是 block 级元素。这样做。

img {
  display: inline;
}