将网站调整为移动设备时出现问题(Devtools vs real)

Problem in adjusting website to mobile (Devtools vs real)

我在我的网站上实现了 Media CSS,当我在 Chrome-Devtools 中调整它的大小时,它调整得很好。 但是当我在移动设备上尝试时,它显示在一个完整的桌面页面中。

这是我的网站: dinf

在 Devtools 中调整页面大小时:

模拟手机时

你能解释一下这是怎么回事吗?

只需将以下行添加到页面的 head 标记中:

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

它允许元素和字体在移动设备上正确缩放。我建议你阅读这篇 article 关于它的文章。