我可以使用什么程序来测试 CSS 媒体查询？答案

【问题标题】：What program can I use to test CSS media queries?我可以使用什么程序来测试 CSS 媒体查询？
【发布时间】：2015-02-01 13:02:39
【问题描述】：

我有一个需要扩展的网站。在这种情况下，我们从 960 向上缩放以查看特定的方式，但是我们说 960 以下的任何内容都必须是 480，而不考虑设备大小。

所以在我放置的标题标签中：

<meta name="viewport" content="width=480, initial-scale=1, maximum-scale=1" />

然后在我使用的 css 中：

@media only screen and (min-width: 960px){}

和

@media only screen and (max-width: 480px){}

我的问题是，我如何测试它以查看它是否跳跃？我有带有 Window Resizer Extension 的 chrome。但我很好奇，就我的设置而言，我这样做是否正确。

【问题讨论】：

带有 Web 开发者插件的 Firefox 会在网站标题中告诉您屏幕分辨率。你在寻找类似的东西吗？
很容易测试。在 chrome 中右键单击页面上的任意位置，然后在下拉菜单中选择“Imspect element”。然后您会在页面窗口下方看到调试框架。在框架的左上角，只需点击电话图标。

【解决方案1】：

桌面浏览器帮不了您。谷歌在移动设备上进行网站测试，例如http://browserstack.com。他们提供了试用版。

【讨论】：

【解决方案2】：

这些花括号之间有一些东西，对;)

我非常幸运地在 chrome 的设备查看器中测试了大多数媒体查询（见图 - 左边看起来像电话的东西）。

【讨论】：