1

演示

我可以在不接触 html 的情况下完成此操作吗？

html...

    <div>
    <img src="http://i50.tinypic.com/1zey0j8.gif" alt="" />WALLPAPER
     <span>some paragraph here 
some paragraph here          /*this should not go below the image*/
some paragraph here 
some paragraph here
</span>
    </div>

css...

div{width: 200px;}
img{float: left; width: 50px; height: 50px;}
span{display: block;}

编辑

Kaloyan Ivanov给了我一个最好的答案。但我想知道溢出隐藏是如何做到的？

4

4 回答 4

4

添加overflow: hidden;到跨度。

http://jsfiddle.net/BYnLd/2/

于 2013-04-23T13:42:44.390 回答
2

因为您可能不知道图像下方的高度。所以使用margin-bottom: 100%;你的形象

看到这个小提琴

编辑

作为已编辑的问题，我为您提供了一个链接

CSS 'overflow:hidden' 如何强制一个元素（包含浮动元素）环绕浮动元素？

于 2013-04-23T13:51:29.343 回答
1

给你的图像一个下边距，如：

img {
    float: left;
    width: 50px;
    height: 50px;
    margin-bottom: 200px;
}

jsFiddle 示例

于 2013-04-23T13:43:20.250 回答
0

You should float the span element also to the left. And make sure that it has a maximum width of 150px.

CSS should look something like this:

div{width:200px;}
img{float:left; width:50px;height:50px;}
span{display:block; width:140px; padding-left:10px;}
于 2013-04-23T13:44:36.237 回答