是否可以使用 CSS Sprite 并仍然支持高密度(例如,视网膜)显示器?这可能意味着将普通分辨率和双分辨率图像打包到一个 Sprite 表中……问题是我将如何指定偏移量?另一种可能的解决方案是以某种方式检测(如何?)屏幕的密度并将一个类应用于 body 。
有人遇到过这个问题吗?任何优雅的解决方案?
最佳答案
您可以使用 min-device-pixel-ratio
媒体查询加载单独的 Sprite 表(并指定单独的偏移量),或在同一 Sprite 表中指定单独的偏移量。
最好为每个密度使用单独的 spritesheet,这样客户端就不需要下载它们无论如何也无法显示的像素。
您可以使用 LESS 或 SASS mixin 指定一次偏移量,然后生成第二个媒体查询规则,使偏移量加倍。
关于css - 使用 CSS sprites 同时仍然支持高密度显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18972097/