Question

我正在开发第一次使用Retina图像支持的网页，

我正在使用

   background: -webkit-image-set( url(images/myimage.png)    1x,
                           url(images/myimage_2x.png) 2x);

我在Mac上运行Safari就像预期的那样，而且Windows上的Chrome也能运行，但是在Windows上使用Internet Explorer和Firefox时，不会显示任何图像。

我想可能会添加背景：url（images / myimage.png），如：

 background: -webkit-image-set( url(images/myimage.png)    1x,
                           url(images/myimage_2x.png) 2x);
 background: url(images/myimage.png)

并且使用它作为回退将是正确的方法，而现在这将获得在Internet Explorer和Firefox中显示的图像然后在Safari上丢失我的Retina版本（它现在只加载标准分辨率图像）。

如果有人能以正确的方式告诉我如何在Mac上为Safari提供视网膜支持，同时为Windows等IE和FF浏览器提供退款。

任何帮助都会很棒

Answer 1

-webkit-仅适用于Chrome和Safari（现在是＆amp; Opera）。您必须为css提供供应商特定的标签以供选择。

来自你的问题，截至目前image-set属性不适用于IE或Firefox。您可以看到此Caniuse data。

新的css背景标签视网膜图像支持多个浏览器，不显示在ff即

1 个答案: