html - 将 2 个图像在彼此正下方向右浮动，而不将文本向下推

Question

如何在不将左侧的文本向下推的情况下将 2 个图像浮动到右侧并直接位于彼此下方？

Answer 1

您可能不想浮动两个图像，因为它们会彼此相邻。你想要做的是将两个图像放在一个 div 中并浮动 div。就像是...

HTML

<div id="container">
    <div id="floated-imgs">
        <img src="img1">
        <img src="img2">
    </div>
    Text, content and whatnot.

</div>

CSS

#container { overflow: hidden; }
#floated-imgs { float: right; }
#floated-imgs img {display: block; }

示例：http: //jsfiddle.net/PQChY/

Answer 2

将两个 imgs 放入一个 div 并浮动该 div。

<div id="img">
    <img src="...">
    <img src="...">
</div>
<p>Lorem ipsum dolor...</p>

和

#img {
    float: right;
}

http://jsfiddle.net/buA2g/