我已经对移动屏幕宽度进行了研究,但有些事情我也无法直接回答。
以 iPhone 4 为例,在这个网站上它的宽度为 640 像素,高度为 960 像素。但是它的设备宽度为 320 像素。什么是设备宽度?我正在制作一个响应式网站,这个设备宽度似乎是一个关键部分。设备宽度是否给定尺寸,以便网站正确缩放?它比桌面站点更小,否则它们将缩放到与桌面显示器几乎相同的分辨率?能否请一些机构解释与实际宽度相关的设备宽度,如果可能的话,请在响应式网页设计和视口元标记的上下文中解释。
我已经对移动屏幕宽度进行了研究,但有些事情我也无法直接回答。
以 iPhone 4 为例,在这个网站上它的宽度为 640 像素,高度为 960 像素。但是它的设备宽度为 320 像素。什么是设备宽度?我正在制作一个响应式网站,这个设备宽度似乎是一个关键部分。设备宽度是否给定尺寸,以便网站正确缩放?它比桌面站点更小,否则它们将缩放到与桌面显示器几乎相同的分辨率?能否请一些机构解释与实际宽度相关的设备宽度,如果可能的话,请在响应式网页设计和视口元标记的上下文中解释。
这是因为您没有设置视口。更多信息在这里:https ://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag
尝试将此元标记添加到您的 head 部分,它应该可以解决您的问题:
<meta name="viewport" content="width=device-width, initial-scale=1.0">