如何在多种屏幕尺寸上查看我的网站？

Question

好的，所以我知道如何为多种屏幕尺寸编写代码。但是，在我的网站上线之前，我不知道如何在移动设备上查看我的代码。请帮忙！

Answer 1

您可以使用可以模拟各种蜂窝设备的仿真器。例如，可以使用名为Bluestacks的程序下载这些程序。

Answer 2

如果你有谷歌浏览器，你可以打开一个网站，然后按F12（在Windows上）进入开发者模式。

在左上角，您可以看到一个小智能手机图标。

单击它并选择一个设备。然后刷新页面。

Chrome会直接从您的计算机上模拟智能手机用户的体验，您可以从那里进行测试。

这是模拟器上这个问题的视图：

Answer 3

如果你正在使用safari，这是解决方案。

1. 启用＆＃34;开发＆＃34;菜单栏使用Safari＆gt;偏好＆gt;高级。您的菜单栏应如下所示：
2. 转到您的网站
3. 转到开发＆gt;用户代理并选择您要模拟的设备/浏览器。

Answer 4

您有两种选择。

1. 使用仿真器。

您需要什么 - 是任何现代浏览器。几乎所有现代浏览器都将为您提供大致相似的仿真器功能，您可以在其中选择目标设备/分辨率。 @intboolstring＆amp; @Pither已经提到过safari＆amp;适合您的镀铬选项。 IE＆amp; Edge具有类似的功能（您可以自己探索或查看此链接IE Emulator feature）。

1. 使用实际设备。

你需要什么 - 1）无线路由器2）你的开发机器/笔记本电脑有一个网络服务器（如Windows上的IIS）＆amp; 3）一些移动设备（我认为你将拥有至少一部带有移动浏览器的智能手机）。

您需要连接您的开发机器/ laotop＆amp;您的设备连接到开发计算机上的无线和设置防火墙，以允许访问本地无线网络上的网站。 Check out this answer

完成此操作后，您应该可以通过在移动浏览器中绑定http://your.dev.machine.ipv4:port-if-applicable/landingpage.html，在无线连接的任何设备上加载您的网站。

（找到你的机器的ipv4地址，转到命令提示符并输入ipconfig并按回车 - 我假设你正在使用windows）

您可能会将测试限制在更小的设备集（您可以访问的设备）。但这将为您提供一个真实世界的想法（如果不是更好的一个）你的网站渲染和表现在设备上。