你好，
几天前我创建了一个新的 React 应用程序，但我遇到了一个问题。
所有元素都比设计上大，尽管它的尺寸相同(1920x1080(。这是因为我的默认系统规模是 125%。当我将其更改为 100% 时，它工作正常。但我希望我的应用程序在所有用户设备上都能很好地显示(即使它们将缩放比例为 125% 作为系统默认值(。
在我的索引中.html我有这样一行：
<meta name="viewport" content="width=device-width, initial-scale=1" />
你知道它有什么问题吗？
正如Codesigner所提到的，通过Web浏览器更改比例会改变窗口的宽度和高度(即window.innerWidth和window.innerHeight(。然后，浏览器将网页呈现到窗口上，并对其进行缩放以匹配视区的尺寸。
从您网站的角度来看，这相当于浏览器窗口大小的变化，这意味着您应该使用 CSS 媒体查询来处理它。但请记住，使用浏览器缩放功能的用户可能有这样做的理由(例如视力不好(，这意味着当用户真正想要扩展您的网站时，您不应该缩小您的网站。
此外，无法检测用户是否使用缩放功能或实际使用具有不同物理屏幕分辨率的设备。您可能会破坏网站的响应能力。
当您更改比例时，它会更新系统的逻辑分辨率。 将其从 100% 设置为 125% 它会减少媒体查询的屏幕宽度。 尝试使用 CSS 媒体查询处理 ot。