有没有一种方法可以在不使用 2x 大小图像 hack 的情况下修复手机上的 Retina 模糊图标?
我是一名前端开发人员,而设计师无法给我提供双倍大小的网站图标。
所以,我想知道是否有任何方法可以保持原始图标大小并使其在配备 Retina 显示屏的手机上看起来正确。
最佳答案
浏览器会自动放大小像素图像,抗锯齿的质量取决于浏览器的渲染引擎。
如果您不想使用媒体查询 @2 技巧,您可以使用 svg 图标代替,因为矢量图形在每个屏幕分辨率和 ppi 上都非常清晰。
编辑: 正如下面评论中提到的,您可以按照此处所述在浏览器中禁用抗锯齿:Disable antialising when scaling images
但这不会从 16 像素的图形中创建一个尖锐的圆圈,因为像素仍然是方形像素(只是放大了)...
关于css - 没有 2x 图像大小 hack 的视网膜模糊图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36605920/