我自己没有用Retina MacBook来测试这些东西,互联网上似乎有很多关于高像素密度显示器网页设计的混淆.
现在,我假设带有Retina显示屏的MacBook上的WebKit将页面缩放了大约两倍的大小,因为大多数网页都不是为了适应更高的像素密度而构建的?
在我看来,设计这些或实际上任何类型的显示器的理想情况是使用ems而不是像你可能做的那样;
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
body { font-size: 150%; }
}
@media
only screen and (-webkit-min-device-pixel-ratio : 2),
only screen and (min-device-pixel-ratio : 2) {
body { font-size: 200%; }
}
Run Code Online (Sandbox Code Playgroud)
并且整个页面将相应地缩放.或者是吗?在Retina MacBooks上运行的浏览器上的默认字体大小是16px还是更高?因为如果它更高,缩放效果会倍增.
我想我的问题是; 如果我一直使用ems,我唯一需要做的就是改变每个设备像素比的字体大小?