chrome手机中的各种手机分辨率是调试真实分辨率吗

1.使用元标签，这也是一种常用的方法，理论上来说，这种标签的使用可以适应各种尺寸的屏幕，但是不同的解释方式和各种设备对标签的支持导致它与所有浏览器或系统不兼容。

首先解释标签的含义：

如果你完全不了解这个标签的用法，你需要先看看它。

解释：这个宽度指的是什么宽度？，我看过的文章对此解释得不是很清楚，有几种选择：虚拟窗口的宽度、手机屏幕的宽度、或者页面的宽度等等，经过实验后就是指虚拟窗口的宽度。

了解了宽度之后，对于后续的各种比例，应该知道谁和谁的比例，是虚拟窗口宽度的页面宽度，这样就会出现问题，Android设备的尺寸差异很大，而主流的灯有320 480 720 1080等尺寸的宽度， 而且上面的标签只能支持一种尺寸，当然有些浏览器会自动缩放来适应屏幕，但这不是一个统一的标准，正确的方法是使用 js 动态生成这个标签，当然应该先得到屏幕尺寸。

此外，还可以与此标签共享以下内容：

1）、user-scalable=no，必须能够保证页面不能缩放才能看到no，有些浏览器不吃这个设置，还有一个诀窍就是minimum-scale=，maximum-scale=最大和最小缩放比例都设置好了。

2） initial-scale= 是由 user-scalable 控制的初始缩放，有些浏览器会把 user-scalable 理解为用户手动缩放，如果 user-scalable=no，initial-scale 不会生效。

3）手机页面可以触摸移动，但如果有需要禁止此操作，页面宽度等于屏幕宽度就是页面刚好适应屏幕，保证页面不能移动。

4）如果缩小页面以适应屏幕的宽度，则会出现问题，当文本框被激活（获取焦点）时，页面将被放大到其原始大小。

以上就是一些使用视口标签的小经验，我就和大家分享一下。

应该，就目前而言，我没有发现此调试有任何问题。

这是因为手机的屏幕尺寸本来就很小，在PC显示器上模拟时，会显得格外小。

在需要模拟的界面上按F12，点击弹窗控制台左上角的手机，然后点击下图箭头2指向的按钮，切换你想要的分辨率。

按快捷键 F12 获取 chrome

单击左侧的电话屏幕图标以设置不同的分辨率

此调试页面可能只是模拟手机分辨率，您还需要更改 UA 来模拟手机设备和系统。

方法步骤如下所述

第一步是用chrome打开要调试的页面;

第 2 步：按 F12 打开 Dock 到主窗口按钮使 Funny Developer Tools 停靠在浏览器右侧，然后单击左上角的 Toggle Device Mode接地按钮。

第 3 步：选择要模拟的设备。

第四，刷新页面，看看手机的效果。

您可以这样做：按住“Ctrl”键，鼠标滚轮可以自由放大和缩小。

检查chrome高级设置，有“网页内容”：字体大小，网页缩放。

看看你是否不小心修改了它。

按住 Ctrl 滚轮并向下滑动。