响应速度：移动版

Question

我是CSS的新手，我正在使用媒体查询创建响应式设计。 当我将浏览器的大小更改为480px或更低（仅@media屏幕和（max-device-width：480px））时，设计工作正常，但是当我在移动设备上打开它或使用chrome上的切换设备工具栏时，它会运行太小了，我没有得到与小窗口桌面上相同的设计

是否缺少某些内容（另一种媒体查询或其他内容），使移动设计与桌面上的小窗口相同。

提前谢谢

Answer 1

您可以尝试将其添加到HTML中吗？

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

我的猜测是变焦是你的问题。要么是这样，要么手机的实际分辨率可能高于480px。

我粘贴的代码行是Bootstrap的一部分，它是最受欢迎的HTML，CSS和JS框架，用于在Web上开发响应式移动优先项目。（引用来自他们的网站。但我并不反对。

我建议看一下使用媒体查询制作的bootstrap，并且真的被认为是响应式网站。