如何根据屏幕分辨率正确缩放网页？答案

【问题标题】：How to properly scale web page according to screen resolution?如何根据屏幕分辨率正确缩放网页？
【发布时间】：2017-09-20 01:22:48
【问题描述】：

我有一个 psd 网页，它的设计分辨率为 1920x1080。

标准笔记本电脑和台式机的分辨率为 1366x768。

我已经使用 Skelton CSS 将 psd 转换为 1366 分辨率的 html

现在我如何放大/缩小元素的尺寸，例如，如果我正在编写 1920x1080 的样式并根据 psd 匹配元素间距，并且以 1366 分辨率查看时，它应该看起来与 psd 完全相同。

就像RetinaJS 一样，它可以根据屏幕大小轻松放大/缩小图像。

有没有什么框架或方法可以让我们轻松改变视图？

谢谢

【问题讨论】：

【解决方案1】：

有不同的技术可以实现您的目标。正如@Jose M 和@WizardCoder 所提到的，您可以使用CSS 的媒体查询，也可以使用Bootstrap 框架根据屏幕大小缩放图像。 Bootstrap 的“img-responsive”类将对您的图像进行公正处理。它会缩小您在任何屏幕上的图像。

【讨论】：

嗯！我必须使用很多媒体查询......但我没有在这里使用引导程序，因为它是一个最小的用户界面项目，所以我只想要基本的 rwd，这就是我选择 skelton css 的原因。