用于小屏幕的媒体查询css

问题：如何使用css@media来定位1024x600以下的所有屏幕

我需要告诉所有的小显示器屏幕使用overflow-x:scroll

上下文：我必须在HTML和BODY标记上使用以下CSS规则：

溢出-x：隐藏！重要的

（否则，某些动画会导致页面上出现难看的水平滚动条。）

但是现在，当使用较小的屏幕查看我的网站时，如果用户可以水平滚动页面就好了

---

我将继续寻找一个css代码段来实现这一点，但我之所以发布这一点，是因为该网站刚刚上线，并且即将受到大量流量的冲击，所以我需要一些快速的解决方案。

我很快找到了答案(http://www.javascriptkit.com/dhtmltutors/cssmediaqueries.shtml)，但我仍然需要弄清楚如何在线测试

/* CSS that's applied when the viewing area's width is 800px or less */
@media screen and (max-width: 800px){
  html{
  overflow-x:auto !important;
  }
  body{
  overflow-x:auto !important;
  }
}

---

因为testsize.com不显示滚动条（我不确定这是滚动条的限制还是我自己的限制）。

您只需调整浏览器窗口大小即可测试媒体查询。您还可以尝试一些bookmarklet：Ctrl+Shift+M也是在Firefox中测试的一个巧妙技巧（不确定来自哪个版本）。