我在我的视网膜监视器上设计了一个网站，以最高分辨率设置。在这个决议上，该网站看起来非常棒：p。但是，当我在较小的13英寸显示器上查看该网站时，所有元素和字体都太大而且在你的脸上。
我做了一些研究，发现有两种方法可以尝试以不同的桌面屏幕尺寸显示网站：
使用媒体查询缩放/变换正文。然而，这“感觉”错了，我可以想象这会产生一些性能影响。此外，我可以想象这会导致屏幕尺寸不一致
全面使用ems。我不确定这是什么是正确的起点，但我已经读到有些人根据它们的字体大小来确定所有内容。但是，我真的不知道这对于图像是如何工作的。
有人可以告诉我，使网站在桌面屏幕尺寸上显示效果的最佳方式是什么。
P.S。该网站基于Twitter bootstrap
答案 0 :(得分：1)
我会建议第二种选择。它的工作方式是在px中设置元素字体大小，并使用容器和div中的相对大小。 例如
<body>
<div id="container">
<article>This is some text</article>
</div>
</body>
CSS：
html{
font-size: 32px;
}
#container{
font-size: 1.5 rem;
}
article{
font-size: 1.2 em;
}
CSS-tricks有一篇很好的文章 - http://css-tricks.com/rems-ems/
对于图像大小调整，可以基于window.width（）
在JS中动态完成