如何在右下角定位背景图像？（CSS）[重复]答案

【问题标题】：How to position background image in bottom right corner? (CSS) [duplicate]如何在右下角定位背景图像？（CSS）[重复]
【发布时间】：2011-12-05 11:47:13
【问题描述】：

我有一个 500x500 像素的图像，它在我的网站上设置为背景图像（作为<body> 的背景图像）但我需要此图像位于网页的右下角。我怎样才能做到这一点？（用css方法更好）

谢谢。

【问题讨论】：

标签： css background

【解决方案1】：

瞧：

body {
   background-color: #000; /*Default bg, similar to the background's base color*/
   background-image: url("bg.png");
   background-position: right bottom; /*Positioning*/
   background-repeat: no-repeat; /*Prevent showing multiple background images*/
}

背景属性可以组合在一起，形成一个背景属性。另见：https://developer.mozilla.org/en/CSS/background-position

【讨论】：

Thnx，你今天帮我安静了很多）））
@Legionar 在 Chrome 43 和 Firefox 38 中对我来说效果很好。
对不起，我的错，它工作正常，但 jquery 正在将 bottom 更改为 0... :-/
我必须添加 background-attachment: fixed; 才能使其正常工作
如果正文元素大小小于视口/内容大小，这可能无法按预期工作。按照评论中的建议添加background-attachment: fixed; 可以避免该问题。

【解决方案2】：

更准确的定位：

      background-position: bottom 5px right 7px;

【讨论】：

很好地提供了通过像素微调相对于“停靠点”的背景图像对齐的示例
这是一种更灵活的方法。干得好。

【解决方案3】：

应该这样做：

<style>
body {
    background:url(bg.jpg) fixed no-repeat bottom right;
}
</style>

http://www.w3schools.com/cssref/pr_background-position.asp

【讨论】：

【解决方案4】：

您是否尝试过类似的方法：

body {background: url('[url to your image]') no-repeat right bottom;}

【讨论】：