1

我正在寻找一种方法，在右下角的图像周围浮动文本。

这是我不工作的版本 http://jsfiddle.net/xaqyb/

HTML

<div id="box">
<img width="120" src="http://www.ordnung-statt-chaos.de/wp-content/themes/thesis/rotator/sample-4.jpg" />
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.   
</div>

CSS

#box { 
    width: 250px; 
    min-height: 150px; 
    position: relative; 
    border: 1px solid #ccc; 
   background: #f7f7f7; 
    padding: 10px; 
}

#box img {
    display: block; 
    float: right; 
}

有任何想法吗？

4

1 回答 1

3

你可以使用 span 到 p 标签中，然后将 img 放入 span 例如：

<div id="wrapper">
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,<span>
<img width="100px" src="http://www.ordnung-statt-chaos.de/wp-content/themes/thesis/rotator/sample-4.jpg" />
</span> no sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>

这种CSS风格是

#wrapper { width: 250px; min-height: 150px; border: 1px solid #ccc;background:#f7f7f7; padding: 10px }
#wrapper img { display: block}
#wrapper span{display: block;float: right;}
于 2012-10-08T11:20:10.440 回答