我应该使用哪种工具进行自适应网络开发：Chrome网站开发人员工具还是只需调整窗口大小？

Question

我一直在努力为移动设备制作一个快速响应的网站。我找到了两种测试响应式设计的方法：

1. 通过调整窗口大小
2. 使用Google Chrome开发人员的工具

在他们两个中我得到了不同的看法。哪一个给了我正确的观点，因为我在'em'中使用了font-size和padding。

Answer 1

调整浏览器窗口大小不响应。在开发响应式应用程序时，最简单但不完美的方法是使用Chrome的开发人员工具。即使这样也可能会给你不同的结果，因为移动设备屏幕不仅使用宽度/高度，还使用dpi。所以320 iphone6s屏幕不会完美匹配320px调整大小的浏览器或等效的Android设备。

Answer 2

转到chrome开发人员工具。这是检查响应能力的好方法。它配备了流行的移动和平板设备的尺寸。因此，您可以一次检查各种设备 简单地调整浏览器大小不是检查响应性的正确方法 最近我建立了一个与你提到的方式一致的页面。您可以查看here 如果您需要任何帮助，请告诉我。

Answer 3

我认为Chrome Dev Tools是本地快照的最佳选择。

但是，如果您有权访问一个或多个移动设备，则可能需要在Heroku或其他生产环境中启动该站点，并从实际设备中查看该站点。

例如iPhone 6，我发现Chrome没有考虑Safari中的地址栏或底部导航，因此iPhone 6的Chrome Dev视图可能略有偏差。