jquery移动页面中没有显示背景图片

Question

我正在使用jQuery移动。我最初尝试设置背景图片html{background: url("bg.png") repeat fixed 0 0;}但没有工作，然后我用身体标签

body {background: url("bg.png") repeat fixed 0 0;}  

不过试过，如果我自定义一个类说.myclass{background: url("bg.png") repeat fixed 0 0;}，然后用它在我的标签，然后它工作正常。

我只是想知道为什么身体或html标签不工作？它是否被覆盖或什么？有什么想法吗？

Answer 1

由于jQuery Mobile独特的页面处理方式，您将无法看到正文容器的更改。每个可见的页面都有一个更大的z-index，它漂浮在主体之上。

基本上你对身体CSS的改变是正确的，但它们不会被看见。

你想要做的是改变这个类：.ui-page。这是每个jQuery Mobile页面的基类。

每个自定义更改都必须覆盖带有！important的经典css。

像这样：

.ui-page { 
    background: url('http://subtlepatterns.com/patterns/escheresque_ste.png') repeat scroll 50% 50% #112233 !important; 
    color: #aabbcc !important; 
} 

这里有一个工作的jsfiddle例如：http://jsfiddle.net/Gajotres/u3E6K/