Question

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

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

但是，如果我定义一个自定义类说.myclass{background: url("bg.png") repeat fixed 0 0;}然后在我的标记中使用它，那么它可以正常工作。

我只是想知道为什么body或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/

背景图像没有出现在jquery移动页面中

1 个答案: