Retina显示媒体查询适用于CSS

Question

我在普通的1440px上创建了一个Web应用程序。现在我必须根据规格转换为视网膜显示2880px。因为我已经放弃了它。它的简单和最佳实践是什么？我试过这样的事情

@media only screen and (min-width : 2800px){
body.checkout-cart-index  input#s_method_flatrate {
    width: 22px;
    height: 12px;
}
}

但我现在知道视网膜是不同的。所以我尝试了https://css-tricks.com/snippets/css/retina-display-media-query/这个查询，但到目前为止我没有帮助。也许我错误地使用了它？

Answer 1

它对你没有帮助吗？

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 

  /* Retina-specific stuff here */

}