-webkit设备像素比查询由iOS和
Android都支持,但由于iOS不支持target-densitydpi = device-dpi,因此导致不同的结果.例如:
@media screen and (-webkit-device-pixel-ratio: 2) { body { font-size: 2em; } }
会使Galaxy Nexus上的字体看起来不错,但是在iPhone 4上它会变得太大了.
有没有办法在iOS上模拟target-densitydpi = device-dpi,或者在iOS上禁用-webkit-device-pixel-ratio,并将其用户的模糊图像作为备用模式?
解决方法
@media (-webkit-min-device-pixel-ratio: 2),/* Retina on Webkit */ (min-resolution: 192dpi) /* Everyone else */ { ... }
从这篇伟大的文章我今天读到:
http://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/