1

我正在尝试使用 JQuery mobile 创建一个页面，我使用 Themeroller 让它看起来像我想要的那样。我使用的背景是渐变的，但它不会全屏显示，除非页面上有足够的内容来填满整个屏幕。见下图：

在此处输入图像描述

看看渐变如何没有到达页面底部？这就是我一直坚持的...

我使用 Themeroller 生成的 CSS 文件。我试着编辑它，但它很大，我不知道在哪里改变什么。

4

1 回答 1

2

看起来背景正在应用于.ui-content不是其容器高度的 100% 的元素。您可以：

  1. 使.ui-content元素 100% 高度或...
  2. .ui-page您可以在元素而不是元素上设置渐变.ui-content。

我会将渐变设置为.ui-page背景，如下所示：

.ui-mobile .ui-page .ui-content {
    background : none;
}
.ui-mobile .ui-page {
    background : /*gradient here*/;
}

这些规则应该足够具体以覆盖 jQuery Mobile 样式表。这是一个演示：http: //jsfiddle.net/YeTdT/

如果您需要帮助创建跨浏览器 css 渐变，请参阅 ColorZilla： http: //www.colorzilla.com/gradient-editor/

于 2012-11-27T00:42:50.560 回答