将图片粘贴到div底部

我有一个div应该包含文本并将其一幅图像揉成一团。
我不希望那个图像永远不会出现这个div。到底部。
该图像的最大值应为128像素。
但是，当div上方的文字太大时，图片应该变小。
我已经试过的东西，但这个棒图片浏览器的底部：将图片粘贴到div底部

<div style="width:250px; height:300px;background:#ff0000;"> 
    <div style="background:#00ff00;">hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/></div> 
    <img src="http://www.blogcdn.com/www.joystiq.com/media/2008/07/ea.logo.round.490.jpg" style="position: absolute; 
                           bottom: 0; 
                           set left: 0; 
                           height: 24px;"/> 
    </div>

更新

<div style="width:250px; height:300px;background:#ff0000;"> 
    <div style="background:#00ff00;">hello<br/>hello<br/>hello<br/>hello<br/>hello<br/> 
hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hjg<br/>jhg</div> 
    <img src="http://www.blogcdn.com/www.joystiq.com/media/2008/07/ea.logo.round.490.jpg" style="position: relative;bottom: 0;left: 0; height:100%;"/> 
    </div>

更新 http://jsfiddle.net/jjehN/

来源

2012-01-25 1110

就像乔纳斯说，容器DIV必须具备的位置是：相对的;还有，为什么你把“set left：0;”？不知道它是否有错字。我从来没有见过任何人使用“设置左”，因为它应该是“左”，我也无法使用谷歌找到它。所以我建议将它从“左”改为“左” – Tom

更新了我的答案。请享用。 –

UPDATE：为了您的使用需求。 “float”代替。请记住在浮动后使用“clear”，以免打破页面。继承人你的代码，工作与textwrapping

<div style="position:relative;width:250px; min-height:300px;background:#ff0000;"> 
    <div style="background:#00ff00;">hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hjg<br/>jhg</div> 

      <img src="http://tools.android.com/_/rsrc/1306369561351/recent/miscellaneousimprovements-1/android_icon_128.png"style="float:bottom; 
         bottom: 0;left: 0; background:#0000ff;max-height: 100%;"/> 
    <div style="clear:both;"></div> 
    </div>

为了使画面收缩/成长。使用Javascript。也许jQuery对你来说最简单。如果您发现任何使用它的麻烦，请在Stackoverflow中进行一次新的练习。

问候乔纳斯

来源

2012-01-25 12:25:23

我更新了问题。如果顶级内容太大，图像仍然不会缩小。 – 1110

如果我删除100％，然后图像出去的分区:( – 1110

我添加了相对于顶部的div和绝对的图像，现在图像不跨越底部，但超过了顶部的文字 – 1110

试试这个：

<div style="width:250px; height:300px;background:#ff0000;position: relative;"> 
    <div style="background:#00ff00;">hello<br/>hello<br/>hello<br/>hello<br/>hello<br/> 
    hello<br/>hello<br/>hello<br/>hello<br/>hello<br/>hjg<br/>jhg</div> 
    <img src="http://www.blogcdn.com/www.joystiq.com/media/2008/07/ea.logo.round.490.jpg" style="position: absolute;bottom: 0;left: 0; height:100%;"/> 
</div>

来源

2012-01-25 12:47:01

@ 1110询问当内容变得太大时如何让图像缩小，这只有帮助将图像定位在div的底部。 –

将图片粘贴到div底部

回答

相关问题