为什么我的 CSS 在移动设备上看起来与在狭窄的桌面浏览器上看起来不同，我该如何更改它？
Why does my CSS look different on a mobile device than it does on my narrow desktop browser and how do I change it?
窄桌面浏览器上的登录屏幕：
移动设备上的登录屏幕：
两边的宽度和高度相同，并且完全相同CSS-代码。
为什么它看起来不一样，我该如何更改它？
如果我尝试使用
@media screen and (max-width: 520px){ ... }
更改 div 的宽度，它在移动设备上看起来更好，但在桌面设备上看起来不同且更差。
不要使用缩小桌面尺寸来在移动设备上查看您的网站
而是使用 chrome 开发人员工具上的移动图标，以查看将在什么屏幕尺寸上显示的内容，并相应地在 CSS 中使用媒体查询，以便您可以在移动设备上获得您想要的外观。
尝试使用百分比而不是像素，应该可以。
您可能会考虑的另一件事是使用 bootstrap 登录页面。
这是一个非常有用的标签，您可以将其放入 head 标签中。这可能是你的问题
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
窄桌面浏览器上的登录屏幕：
移动设备上的登录屏幕：
两边的宽度和高度相同，并且完全相同CSS-代码。
为什么它看起来不一样，我该如何更改它？
如果我尝试使用
@media screen and (max-width: 520px){ ... }
更改 div 的宽度，它在移动设备上看起来更好，但在桌面设备上看起来不同且更差。
不要使用缩小桌面尺寸来在移动设备上查看您的网站
而是使用 chrome 开发人员工具上的移动图标，以查看将在什么屏幕尺寸上显示的内容，并相应地在 CSS 中使用媒体查询，以便您可以在移动设备上获得您想要的外观。
尝试使用百分比而不是像素，应该可以。 您可能会考虑的另一件事是使用 bootstrap 登录页面。
这是一个非常有用的标签，您可以将其放入 head 标签中。这可能是你的问题
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">