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;