css - jQuery Mobile 视网膜图标不显示

Question

视网膜图标不显示非视网膜图标太小。我对 *2.png 使用 18x18 和 36x36。知道如何解决这个问题吗？

.ui-icon-roto {
    background-image: url("imgs/roto_icon.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .ui-icon-roto {
        background-image: url("imgs/roto_icon2.png");
        background-size: 36px 36px;
    }
}

Answer 1

背景尺寸应为 18x18

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .ui-icon-myapp-settings {
        background: url("settings@2x.png") no-repeat rgba(0, 0, 0, 0.4) !important;
        background-size: 18px 18px;
}
}