WEB 前端切图更友好的兼容Retina屏幕

最新推荐文章于 2019-04-24 15:36:00 发布

原创最新推荐文章于 2019-04-24 15:36:00 发布 · 450 阅读

0 ·

CC 4.0 BY-SA版权

web前端专栏收录该内容

13 篇文章

订阅专栏

本文详细介绍了如何使用不同的浏览器前缀实现响应式图像设置，包括如何根据不同分辨率提供不同图像资源的方法。通过这些技术，可以确保网站在各种设备上都能呈现出清晰且加载快速的图像。

  background-image: url(assets/no-image-set.png); 
  background-image: -webkit-image-set(url(assets/test.png) 1x,url(assets/test-hires.png) 2x);
  background-image: -moz-image-set(url(assets/test.png) 1x,url(assets/test-hires.png) 2x);
  background-image: -o-image-set(url(assets/test.png) 1x,url(assets/test-hires.png) 2x);
  background-image: -ms-image-set(url(assets/test.png) 1x,url(assets/test-hires.png) 2x);