我怎样才能用右下角的div来包装文字呢?
每次我试着用CSS做一些看似简单的事情,它都不起作用。
我有一个内容div,其中包含一个460x160图像。我要做的就是把图片放在右下角,然后把我的文字包在上面。
text text text text text text ...
所以我想让它看起来像:
------------------
| text text text |
| text text text |
| text text -----|
| text text | |
------------------
用左上角或右上角的图像来做这件事就是蛋糕:
#contents img { float:right; }
------------------
| text text | |
| text text -----|
| text text text |
| text text text |
------------------
现在我该怎么把它推到底部呢?到目前为止,我想出的最好办法是:
#contents img { float:right; margin-top: 90%} // really needs to be 100%-160px
------------------
| text text |
| text text |
| text text -----|
| text text | |
------------------
在这种情况下,文本不会在边距中打印,因此图像上方有空白。
#contents { position:relative; }
#contents img { position:absolute; right:0; bottom:0; }
-or-
// move the img tag under the text in the html and:
#contents img { float:right; margin-top:-160; }
------------------
| text text text |
| text text text |
| text text -----|
| text text | te |
------------------
在这种情况下,文本打印在图像的上方或下面。
所以.。我怎样才能做到这一点?