Android 背景附件扰乱了Jelly Bean WebView中的渲染？_Android_Css_Android Webview_Android 4.2 Jelly Bean

Android 背景附件扰乱了Jelly Bean WebView中的渲染？

android css

Android 背景附件扰乱了Jelly Bean WebView中的渲染？,android,css,android-webview,android-4.2-jelly-bean,Android,Css,Android Webview,Android 4.2 Jelly Bean,似乎后台固定CSS属性在Jelly Bean WebView（应用程序内部和使用默认Android浏览器）中无法正常工作如果设置此属性，背景图像将加载到内容上，即内容位于背景图像后面以下是我的相关HTML代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; char

似乎后台固定CSS属性在Jelly Bean WebView（应用程序内部和使用默认Android浏览器）中无法正常工作

如果设置此属性，背景图像将加载到内容上，即内容位于背景图像后面

以下是我的相关HTML代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">   
<meta name="viewport" content="target-densitydpi=device-dpi">
<meta name="viewport" content="initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="./gesture-background_files/genre-channel-background.css">
<style type="text/css"></style></head>
<body>
<div id="right-keys">
    <a href="keypress://1"><img src="./gesture-background_files/one.png"></a><br />
    Film24<br />                    
</div>
<div id="right-keys-vertical">
    <a href="keypress://1"><img src="./gesture-background_files/one.png"></a><br />
    Film24<br />
</div>
<div id="footer">
    MUSCADE<span class="large">EPG</span>
</div>   
</body>
</html>

它有点长，但唯一重要的部分是CSS文件顶部的

背景附件

和

背景位置

属性。如果我去掉这些，一切正常

这是已知的bug吗？有人能提出解决办法吗

这里有一个指向该文件的链接，您可以尝试从Jelly Bean本机浏览器（而不是Chrome）打开它：

对于位置相关和绝对，可以使用z索引。阅读更多关于z-index的信息：

事实证明，如果您使用

body {
   background-image: url(any-image.jpg);
   background-attachment: fixed;
   background-position: bottom;
}

或者任何涉及

底部

或

右侧

的内容对于

背景位置

，您相对于屏幕右边缘或底部边缘定位的任何元素都将被背景图像覆盖

这肯定是Jelly Bean浏览器中的一个bug

我没有使用上面的代码，而是使用以下代码在页面上放置背景图像：

HTML:

在我的网站上，为了使背景图像重新出现在内容后面（在Jelly Bean浏览器上），我只需删除css属性：background attachment:fixed

Zoltan的解决方案对我来说效果不佳，因为它使背景图像在某些浏览器中无法正确显示（在browserstack上测试）

提醒了我。我的问题是我想将背景固定在屏幕的左下方。如果只删除背景附件：已修复，则无法定位背景图像。

http://212.92.197.78/gesture/gesture-background.htm

body {
   background-image: url(any-image.jpg);
   background-attachment: fixed;
   background-position: bottom;
}

<body>
   <img id="background" src="any-image.jpg" />
   (...)
</body>

#background {
   z-index: -1;
   position: fixed;
   bottom: 0;
   left: 0;
}