扩展浮动:左边的属性超出图像大小

时间:2017-11-19 05:13:15

标签: html css

如何将css中的float:left属性扩展到图像大小之外?在html中我有

<img src = "http://www.inspiredtaste.net/wp-content/uploads/2016/12/Easy-Banana-Bread-Recipe-2-1200.jpg" width = 50px> some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text 

在css我有

img{float:left;}

你如何将浮动:左边的属性扩展到图像之外?也就是说,即使图像结束,你如何保持jfiddle中的“某些文本”全部对齐?

https://jsfiddle.net/jhee2rrj/

2 个答案:

答案 0 :(得分:0)

只需在文字中添加一个边距。

<p style="margin-left: 50px"> some text some text...</p> 

答案 1 :(得分:0)

如果你想将图像高度设置为适合内容,它就不会起作用。 最好在文本高度合适的情况下为图像设置边距:

img
{
float:left;
margin-bottom:150px;
}

div{
height:200px;/*You can set this height as required*/
}
<div><img src = "http://www.inspiredtaste.net/wp-content/uploads/2016/12/Easy-Banana-Bread-Recipe-2-1200.jpg" width = 50px> some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text some text </div>