Question

body {
   height: 100%;
   background-color: #f8f8f8 ;
   background-image: url('images/bottom-right.png'); /*Images*/
   background-position: right bottom; /*Positioning*/
   background-repeat: no-repeat; /*Prevent showing multiple background images*/
}

所以我有这个代码将图像放在身体的右下角，但问题是它不是以我想要的方式定位。它向右移动但不在底部。它只有里面的内容高，就像一个div或其他任何东西。你可以帮助我实现我想要的目标。

这是图片 - ＆gt; http://tinypic.com/view.php?pic=2iabd3p&s=8谢谢

Answer 1

您还需要在html上设置高度并删除正文上的边距：

body {
    height: 100%;
    background-color: #f8f8f8;
    background-image: url('http://www.placehold.it/100x100');
    background-position: right bottom;
    background-repeat: no-repeat;
    margin:0;
    padding:0;
}
html {
    height:100%;
}

<强> jsFiddle example

Answer 2

简单地设置height: 100%;并不适用于所有情况。虽然我通常不喜欢使用CSS2 position，但在这种情况下这可能对你有帮助......

body, html
{
 bottom: 0px;
 left: 0px;
 overflow: auto;
 position: absolute;
 right: 0px;
 top: 0px;
}

HTML - 身高不是100％

2 个答案: