我怎样才能让我的网站在 1920 x 1080 和 3840 × 2160 上看起来完全一样
How can I have my website to look exactly the same on 1920 x 1080 and 3840 × 2160
想象一个充满组件和文本的网站，它在 1920 x 1080 笔记本屏幕上运行良好。
如果您将图像从 1920 x 1080 笔记本投影到 3840 × 2160 显示器，它在两个屏幕上看起来是一样的，可能因为放大而有点模糊。
但是如何在 3840 × 2160 笔记本屏幕上实现相同的结果，使其看起来与在 1920 x 1080 笔记本上完全一样？
假设我有办法检测分辨率是否高于 1920 x 1080。仅使用缩放不会达到预期的结果。
transform: scale(2);
... 因为网站只会延伸到布局之外。
例如缩放每个字体、图像或任何未按百分比定义的内容。
在我的脑海里有一个想法，如果你能以某种方式阻止网站扩展到超过 1920 像素（密度方面）并通过按比例缩放内容来填充空白，但这听起来很疯狂，有什么建议吗？
CSS 中有一个 zoom 属性，正如 Robert Harvey 提到的那样。
要缩放组件两次，请将此行添加到 HTML 容器：
zoom: 2;
但任何版本的 Firefox 都不支持它。
如果按比例放大所有内容并按比例减小宽度，您仍然可以在 Firefox 中实现类似的效果：
-moz-transform: scale(2);
-moz-width: 50%;
-moz-transform-origin: top left;
如果您不需要水平滚动，它会起作用，但它会向页面添加滚动条，zoom 可能不会出现滚动条，并且还会缩放元素内的滚动条，使它们变胖（这不是如果您不需要容器内的滚动条，就会出现问题。
想象一个充满组件和文本的网站，它在 1920 x 1080 笔记本屏幕上运行良好。
如果您将图像从 1920 x 1080 笔记本投影到 3840 × 2160 显示器，它在两个屏幕上看起来是一样的，可能因为放大而有点模糊。
但是如何在 3840 × 2160 笔记本屏幕上实现相同的结果，使其看起来与在 1920 x 1080 笔记本上完全一样？
假设我有办法检测分辨率是否高于 1920 x 1080。仅使用缩放不会达到预期的结果。
transform: scale(2);
... 因为网站只会延伸到布局之外。 例如缩放每个字体、图像或任何未按百分比定义的内容。
在我的脑海里有一个想法，如果你能以某种方式阻止网站扩展到超过 1920 像素（密度方面）并通过按比例缩放内容来填充空白，但这听起来很疯狂，有什么建议吗？
CSS 中有一个 zoom 属性，正如 Robert Harvey 提到的那样。
要缩放组件两次，请将此行添加到 HTML 容器：
zoom: 2;
但任何版本的 Firefox 都不支持它。 如果按比例放大所有内容并按比例减小宽度，您仍然可以在 Firefox 中实现类似的效果：
-moz-transform: scale(2);
-moz-width: 50%;
-moz-transform-origin: top left;
如果您不需要水平滚动，它会起作用，但它会向页面添加滚动条，zoom 可能不会出现滚动条，并且还会缩放元素内的滚动条，使它们变胖（这不是如果您不需要容器内的滚动条，就会出现问题。