在移动设备上预览网页

Question

我是html的新手。我目前正在使用django创建网站，并且想知道有什么方法可以通过电话预览我的网站吗？例如，如果我将宽度设置为1000px，在移动设备中它将如何显示？

Answer 1

如果您使用的是谷歌浏览器，则可以检查页面（CTRL + SHIFT + I），然后选择左上角的设备图标。此选项将向您显示您的网站在移动设备上的响应方式。

Answer 2

您应该构建一个响应式Web应用程序。响应式Web设计是一种建议设计和开发应基于屏幕尺寸，平台和方向来响应用户的行为和环境的方法。

实践包括灵活的网格和布局，图像以及CSS媒体查询的智能使用。当用户从笔记本电脑切换到iPad时，网站应自动切换以适应分辨率，图像大小和脚本编写功能。

Answer 3

您可以使用Google Chrome开发工具，但我发现它们严重不足且常常不准确。他们不能很好地渲染我当前正在工作的网站。

我建议使用Ngrok之类的工具。它可用于让您在本地计算机上托管开发环境，同时在移动设备上轻松查看站点。

Answer 4

首先，我建议使用Bootstrap之类的框架，该框架可使您页面上的所有组件都具有100％的响应速度（组件会自动调整为显示大小）。 在浏览器上测试网站时，右键单击任意位置，然后选择“检查”。系统将为您提供一个查看窗口，您可以在其中选择所需的移动设备以在其上模拟您的网站。 See image