微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

更正放大缩小百分比范围以测试不同设备上不同浏览器的响应能力

如何解决更正放大缩小百分比范围以测试不同设备上不同浏览器的响应能力

我正在使用 Google Chrome 并测试我正在开发的网络应用程序的响应能力。截至今天,我有

  1. Google Chrome - 版本 88.0.4324.96(官方版本)(64 位)
  2. Mozilla Firefox - 版本 84.0.2(64 位)

Chrome 提供 25-500% 的缩放百分比,而 Mozilla 提供 30-300%。

我注意到这些百分比范围有一段时间了。

问题: 对于从宽屏到手持设备的大多数设备,测试 css/html 响应能力的最小和最大百分比的正确范围是多少——比如弯曲的超宽屏桌面显示器和超高分辨率笔记本电脑一直到iphone8 或类似尺寸屏幕的手机?

我问现在在 UI/UX 世界中,每个企业和项目管理团队都关心应用程序页面在所有屏幕尺寸设备上的响应能力。而且我们可能没有手头的所有设备来获得“虚假”的信心,即应用程序在不同屏幕尺寸上的表现。我们的开发机器都是基于 Windows 的,根本没有 Safari。所以现在问题变成了,我们是否可以通过某种方式依赖特定浏览器的放大缩小百分比范围来了解预期行为?

解决方法

我建议使用Chrome 开发者工具中的设备工具栏。您可以调整视口大小来模拟不同的设备。

enter image description here

当您需要模拟比当前屏幕更大(和更小)的设备时,这很有效。

我当前的笔记本电脑显示分辨率为 1920x1080。如果我想准确地测试更大的设备,例如 2048x1536,我可以在 Chrome 的开发人员工具中将视口宽度和高度调整为 2048x1536: enter image description here

现在看一下来自 BrowserStack 的屏幕截图,它显示了一个真实的 2048x1536 屏幕尺寸,并注意它完美匹配: enter image description here

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。