3

我在使用 3800x2400 分辨率(推荐 300%)的屏幕时遇到问题。我有一个屏幕为 1920x1080(监视器 1)和另一个如上所述(监视器 2),我正在使用 rems,我的代码在监视器 1 中显示完美,但在监视器 2 中变得太大:所有尺寸、边距、当我检查 DOM 时,px 中的填充是相同的,除了在监视器 2 中它显示得太大并且有滚动条。

html { 
  font-size: 8px;

  @media (min-width: @screen-sm-min-width) { 
    font-size: 10px;
  }

}

@screen-sm-min-width = 768px

我使用基于 8px 计算移动设备的 rems,以及基于 10px 计算平板电脑或更大尺寸的 rems。

监视器 1

在此处输入图像描述

监视器 2

在此处输入图像描述

在监视器 2 中,它太大了,需要一个滚动条。我检查了 DOM,所有尺寸都以 px 为单位,与监视器 1 中的一样。为什么会这样显示?

4

1 回答 1

1

这是 DPI 缩放的问题。Chrome 从 54 版开始就遇到了这个问题。

如果您在 Windows 10 上运行 Creator 的更新,您可以通过转到 Web 浏览器的属性,选择“兼容性”并选中“覆盖高 DPI 缩放行为”来解决此问题。

在此处输入图像描述

于 2017-08-09T17:17:23.407 回答