如何在Firefox浏览器中模拟移动设备和调试？

Question

我正在寻找一种工具,以移动设备模式显示我的网站.此外,我想用Firebug等工具调试我的网站......或者更好,我可以使用Firebug.这样做的既定解决方案是什么？

Answer 1

您可以使用工具自带的浏览器(Firefox,IE,Chrome ...)来调试您的JavaScript.

至于调整大小,Firefox/Chrome有自己的资源可通过Ctrl+ Shift+ IOR 访问F12.转到选项卡"样式编辑器"并单击"自适应/响应式设计"图标.

旧Firefox版本

新的Firefox/Firebug

铬

*另一种方法是安装像"Web Developer"这样的插件

Answer 2

使用Ctrl+ Shift+ 使用响应式设计工具M.

Answer 3

大多数Web应用程序都会根据HTTP标头检测移动设备.

如果您的网站还使用HTTP标头识别移动设备,则可以执行以下操作:

1. 添加修改标题插件到您的Firefox浏览器( https://addons.mozilla.org/en-US/firefox/addon/modify-headers/ )
2. 使用插件修改标头:
   • 选择标题选项卡 - >选择操作'添加'
   • 模拟例如iPhone添加名称User-Agent和值的标题:Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543 Safari/419.3
   • 点击"添加"按钮
3. 之后,您应该能够在Firefox中看到您的Web应用程序的移动版本并使用Firebug插件.

希望能帮助到你!

Answer 4

您可以使用Firefox附加用户代理覆盖.使用此附加组件,您可以使用您想要的任何用户代理,例如:

Firefox 28/Android: Mozilla/5.0 (Android; Mobile; rv:28.0) Gecko/24.0 Firefox/28.0

如果您的网站通过用户代理检测到移动设备,则可以通过这种方式测试布局.

更新于2017年11月:

由于Firefox 57的发布和Web扩展的引入,这个附加组件不再可用.或者,您可以general.useragent.override在配置中编辑Firefox首选项:

1. 在地址栏中输入 about:config
2. 搜索 general.useragent.override
3. 如果首选项不存在,请右键单击about:config页面,单击New,然后选择String
4. 将新首选项命名为general.useragent.override
5. 将值设置为所需的用户代理

Answer 5

我将使用工具 - > Web开发人员 - >响应式设计视图下的"响应式设计视图".它可以让您根据不同的屏幕尺寸测试CSS.