Question

所以，我试图让背景图像在任何设备上工作，无论你在哪里滚动，它都会覆盖身体并停留在同一个地方。设置背景附件：固定;适用于大多数设备，Android 2.X除外。现在，我正在尝试的是有一个单独的div，用背景图像填满屏幕。

我从This answer得到了这个想法。完美的工作！有时，除非屏幕尺寸发生变化或内容发生变化，否则背景会突然变为白色。这种情况偶尔发生，我找不到原因。

这是我的css背景：

#background{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: url('../Images/About/about_background@2x.png');
    background-size: cover;
    background-position: top center;
    background-origin: padding-box;
    background-attachment: fixed;
}

这是HTML：

<body ng-controller="MainCtrl">
    <div id="background"></div>

    <div id="wrapper"  class="">
        <div id="scroller" >
            <div class="container" style="" ng-view ng-class="slide">
            </div>
        </div>
    </div>
</body>

我注意到在开发人员工具中检查元素并删除＆＃34; .container＆＃34;将删除白色背景和＆＃34;真实＆＃34;背景将再次显示。

有人知道为什么会这样吗？或者，如果有更好的方法来获得固定位置的背景图像，请告诉我！提前谢谢！

Answer 1

身体上的

如果您愿意，可以尝试使用此解决方案：

background: url(img/aurora.png) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

背景位置固定

1 个答案: