Chrome 的设备工具栏有漏洞吗?



我使用的是Chromium Version 51.0.2704.63(64位)

<html>
<head>
<style>
html, body {
  margin: 0;
}
div  {
  background-color: black;
  height: 100px;
  width: 50vw;
  max-width: 100vw;
  min-width: 360px;
}
</style>
<body>
<div></div>
</body>
</html>

尝试将此标记粘贴到记事本中,保存为.html文件并运行它。进入Chrome的设备工具栏,选择Lumia 950

你会注意到的两件事:-在开发人员工具箱模型视图中,您将看到尺寸为490 × 100在设备工具栏中,你会看到屏幕是360x640

这是怎么回事?那么490就是新的180吗?

你错过了

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

在你的<head> .

Devtools没有坏,它只是模拟你在一些手机上得到的实际像素。

最新更新