如何在分区的右下角放置img

有两种方法可以做到这一点。最简单的:

<div class="outer">
<img src="....">
</div>

具有

div.outer { position: relative; height: 24px; }
div.outer img { position: absolute; right: 0; bottom: 0; }

现在它脱离了正常的流程,问题是您希望其他内容围绕它进行包装/浮动。在这种情况下,你真的需要知道图像的高度,然后根据你所得到的应用适当的技巧。

从开始 Making the absolute, relative .

例如,如果图像高10像素,您可以尝试以下操作:

div.outer { height: 24px; }
div.outer { float: right; margin-top: 14px; }

当然14px来自24px-10px。我不知道这是否能满足你想要达到的目标。

背景图像是你的解决方案。

<div class="blarg" style="background:url(image.gif) bottom right no-repeat">Content</div>

您可能还需要调整DIV的填充,这样DIV的内容就不会与您的图片重叠(如果需要的话)。

如果你想在图片周围浮动文本,这两个答案都是错误的。两者都会使文本直接覆盖图像。我已经找了好几个小时了,似乎没有真正的答案。 This article 更清楚地解释了如果您试图包装文本,这两个答案为什么都不起作用。