css - 使用@2x.png 背景图片

Question

我们目前正在使用 SVG 和 PNG 后备的不同站点上运行样式表。

这也适用于视网膜图像吗？

    background: url('/sfdt/mobile/images/template/sfdt-sprite_header-elements.png') -110px 0px / 190px no-repeat;
    background: url('/sfdt/mobile/images/template/sfdt-sprite_header-elements@X2.png') -110px 0px / 190px no-repeat;

或者最好通过这样的媒体查询来运行它？

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (-o-min-device-pixel-ratio: 3/2),
  only screen and (min--moz-device-pixel-ratio: 1.5),
  only screen and (min-device-pixel-ratio: 1.5) {

谢谢

达里尔

Answer 1

通常以下行应该单独工作：

background: url('/sfdt/mobile/images/template/sfdt-sprite_header-elements@X2.png') -110px 0px / 190px no-repeat;