为什么我的 CSS 在移动设备上看起来与在狭窄的桌面浏览器上不同？如何更改它？

Question

窄桌面浏览器上的登录屏幕：

移动设备上的登录屏幕：

两侧具有相同的宽度和高度以及完全相同的 CSS 代码。
为什么它看起来不一样？我该如何改变它？

如果我尝试使用

@media screen and (max-width: 520px){ ... }

更改 div 的宽度，它在移动设备上看起来更好，但在桌面设备上看起来不同且更差。

Answer 1

这是一个非常有用的标签，您可以将其放入 head 标签中。这可能是你的问题

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">