我能'；看不到带有视网膜显示的jquery移动图标

我的问题是：如果我使用带有视网膜显示器的iphone4，我看不到icons-18-white.png中的任何图标（使用iPad和iPhone3GS，一切都很好）

如果我在浏览器中测试png，通过以下设置，一切都很好：

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-resolution: 240dpi) {
.ui-icon-plus, .ui-icon-minus, .ui-icon-delete, .ui-icon-arrow-r,
.ui-icon-arrow-l, .ui-icon-arrow-u, .ui-icon-arrow-d, .ui-icon-check,
.ui-icon-gear, .ui-icon-refresh, .ui-icon-forward, .ui-icon-back,
.ui-icon-grid, .ui-icon-star, .ui-icon-alert, .ui-icon-info, .ui-icon-home, .ui-icon-search, .ui-icon-searchfield:after, 
.ui-icon-checkbox-off, .ui-icon-checkbox-on, .ui-icon-radio-off, .ui-icon-radio-on {
background-image: url(images/icons-36-white.png);
-moz-background-size: 776px 18px;
-o-background-size: 776px 18px;
-webkit-background-size: 776px 18px;
background-size: 776px 18px;
}
.ui-icon-alt {
background-image: url(images/icons-36-black.png);
}
}

/* plus minus */
.ui-icon-plus {
background-position: -0 50%;
}
.ui-icon-minus {
background-position: -36px 50%;
}

/* delete/close */
.ui-icon-delete {
background-position: -72px 50%;
}

/* arrows */
.ui-icon-arrow-r {
background-position: -108px 50%;
}
.ui-icon-arrow-l {
background-position: -144px 50%;
}
.ui-icon-arrow-u {
background-position: -180px 50%;
}
.ui-icon-arrow-d {
background-position: -216px 50%;
}

---

需要帮助-提前感谢

您需要创建格式为[filename]@2x.png的其他图标。非常清楚地解释了如何执行此操作。

仅供参考…文件名不必是@2x.png，这正是iPhone应用程序执行此操作的方式。我认为继续使用这种格式是个好主意。

如果您指的是本地下载的jQuery Mobile文件（而不是使用jQuery Mobile CDN），请确保项目中包含了所有图像文件。对于高分辨率显示，使用了不同的sprite图像（icons-36-white.png而不是icons-18-white.png）。

我使用CDN版本时也遇到了同样的问题。我通常在PC上测试，但不得不在MAC上用我的IPad调试其他东西。在那里，我看到它拉了

图标-36-white.png

而不是

图标-18-white.png

，这是我在PC上提到的图标（在我的应用程序清单文件中）

因此，在使用离线阅读制作HTML5应用程序时，请始终保持对这两个文件的引用