如何使自定义CSS游标与视网膜兼容？

Question

我想知道如何在视网膜显示器上的webapp中使用自定义光标.我知道通常情况下,由于比例因子,图像将以正常尺寸的两倍显示,并且在使网站与视网膜显示器兼容时,您必须采用2倍比例图像,并设置其浏览器内渲染宽度和高度为实际尺寸的一半.由于游标没有大小属性​​(据我所知),如何确保以最高保真度呈现光标？

谢谢.

Answer 1

我非常喜欢这里提出的通用解决方案，尤其是作者记得针对所有可以在配备 Retina 显示屏的 Macbook Pro 上运行的浏览器。

@media only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
    /*your hi-res cursor styling*/
}

我很好奇当在相同的硬件上运行时（使用 Bootcamp 或 Parallels 等），这是否可以在 Windows 中正常工作