Chrome / Safari或IE上的响应式设计视图

Question

在 Firefox 中，我可以按 ctrl + shift + m 我可以将上下文区域调整为720 * 720。

等大小

如何在 IE ， Chrome 或 Safari 上执行此操作？

Answer 1

在Apple的Safari中，诊断响应式视图的最佳选择是使用以下内容： -

1. 打开Safari并点击Safari＆gt;偏好＆gt;高级

2. 启用菜单栏中的＆＃34;显示开发菜单＆＃34;选项并关闭首选项对话框

3. 现在屏幕顶部应该有一个“开发”菜单项

4. 单击“开发”菜单，然后选择“＃34;启用Resposnive Design Mode＆＃34;或使用键盘快捷键[Command] + [Option] + R. ⌥ + ⌘ + R

Answer 2

这是我在Safari和Chrome上使用的一个javascript工具，虽然我不确定它在IE中是如何工作的;非常有用：http://responsive.victorcoulon.fr

Answer 3

IE中没有这样的东西。通过点击右下角的齿轮作为“覆盖 - ＆gt;设备指标”，您可以在开发工具中使用Chrome。

Answer 4

IE11中新的重写开发工具将包含一项功能，允许您设置浏览器的分辨率和方向，以便与测试响应式布局一起使用。

See here了解详情。

（请注意，IE11尚未发布，但如果您想试用它，则会预览）

Answer 5

我的Chrome中的选项（32.0.1700.41 beta-m Aura）是“Overrides” - ＆gt; “在控制台抽屉中显示'仿真'视图”。然后单击齿轮图标旁边的“显示控制台”图标。

Answer 6

在Chrome中模拟屏幕分辨率的最简单方法是将其Dev Tools停靠在右侧（右上角有按钮），然后拖动其边框（以及可选的底部浏览器边框）。 Chrome会在其右上角显示当前视口尺寸，因此您可以使用320x480px。它与FF响应设计视图非常相似。

Answer 7

铬

首先启用“仿真”，转到Settings (Gear Icon)并检查控制台抽屉中的“显示'仿真'视图” 现在，关闭设置面板，然后按 Esc ，您将获得一个Emulation选项卡。你可以在那里做很多改变。更改屏幕大小，模拟触摸，加速度计，用户代理欺骗等

如果您收到警告“此页面上没有Chrome屏幕模拟”，（可能您在Linux中，Chrome目前已禁用某些内容），那么您需要更改[[chrome ：// flags] [chrome：// flags]选项跟进此solution

---

IE11

对于IE 11，F12开发人员工具有一个用于更改设备指标的专用选项卡等。

我不使用Safari，所以我不能说它。