响应式设计采用不同的屏幕尺寸来呈现在各种设备（例如移动电话或者平板电脑）下的可视情况。响应式设计视图使您可以很容易地看到您的网站或者网站app在不同屏幕尺寸下的外观。
下面的截屏是在328*480分辨率下展示的一个维基百科移动版页面。
响应式设计视图使用非常方便，您可以快速和精确地改变展示区域的大小。
当然，您可以改变浏览器窗口本身的大小。但是如果把浏览器窗口变小，其他的浏览器内容也会相应变小，可能会使得浏览器界面变得不那么好用了。
当你打开响应式视图，你可以继续正常地进行浏览。While the Responsive Design View is enabled, you can continue browsing as you normally would in the resized content area.
打开和关闭
有两个方法打开响应式视图：
- 在火狐浏览器菜单（或者工具栏菜单-如果您选择了显示菜单，或者是您在使用Mac OS X）下的Web开发者子菜单下选择“响应式视图”；
- 点击工具箱工具栏里的“响应式设计模式”按钮
有三个方法关闭响应式视图
- 再次选择菜单里的“响应式设计视图”
- 按键盘上的Esc键
- 点击左上角的“关闭”按钮
改变大小
有两个方法改变内容区域的大小：
- 使用“选择大小”按钮
- 点击和拖放内容区域右边和下方，或者是右下角的控件
如果您使用拖放的方式改变大小，可以按住Control键（Mac OS X下用Cmd键）来减缓改变的速度，可以更精确地控制大小。
在响应式视图窗口的顶部有五个控件：