需要修复视网膜精灵css问题

我正在尝试优化移动皮肤，使www.talkjesus.com更清晰

我用独立的图片完成了这项工作，比如facebook/twitter图标、徽标和标题中的右上角3个图标

我遇到的问题是，这样做完全是为了精灵图像

这是css代码（默认值）

这是原始精灵：

这是我做的新的，64px：

默认情况下，视网膜样式图像应至少比将应用的大小大2倍。在本例中，它是24px原始版本，但我不知道如何修改css代码以反映新的维度，因此它从64px版本中提取正确的图标，同时仍在24px live上显示

---

感谢您的帮助

我为此创建了一个新的精灵生成器，与其他精灵不同，您可以使用视网膜图像创建一个常规精灵，最后您可以在首选项中选中一个选项，告诉它是用于视网膜的，下载时您将获得常规精灵和视网膜精灵

并且还可以为它获取生成的css

---

您可以检查下面的工具，从您创建的精灵生成CSS

---

查看你的图片链接你不需要提及，就像我知道我在回复一篇旧帖子一样，只是以防万一，我会在以后的某个时候提及它，欢迎随时回复。

.ui-icon, .ui-icon-searchfield:after {
background-image: url({vb:stylevar imgdir_mobile}/metro-icons-24.png);
border-radius: 0;
background-color: transparent;
}
.ui-icon-plus {background-position:-0 50%}
.ui-icon-minus {background-position:-28px 50%}
.ui-icon-delete {background-position:-56px 50%}
.ui-icon-arrow-r {background-position:-84px 50%}
.ui-icon-arrow-l {background-position:-112px 50%}
.ui-icon-arrow-u {background-position:-140px 50%}
.ui-icon-arrow-d {background-position:-168px 50%}
.ui-icon-check {background-position:-196px 50%}
.ui-icon-gear {background-position:-224px 50%}
.ui-icon-refresh {background-position:-252px 50%}
.ui-icon-forward {background-position:-280px 50%}
.ui-icon-back {background-position:-308px 50%}
.ui-icon-grid {background-position:-336px 50%}
.ui-icon-star {background-position:-364px 50%}
.ui-icon-alert {background-position:-392px 50%}
.ui-icon-info {background-position:-420px 50%}
.ui-icon-home {background-position:-448px 50%}
.ui-icon-search,.ui-icon-searchfield:after {background-position:-476px 50%}
.ui-icon-checkbox-off {background-position:-554px 50%}
.ui-icon-checkbox-on {background-position: -530px 50%;}
.ui-icon-radio-on {background-position: -577px 50%;}
.ui-icon-radio-off {background-position: -601px 50%;}