不是javascript的宽度'；screen.availWidth'；与CSS3媒体查询最大宽度相同？

我一直在我的手机上试用一个简单的网页（请参阅底部关于浏览器等的说明），并使用以下两种媒体查询：

@media all and (max-width: 979px) { ... css setting a background color for a certain element
@media all and (min-width: 980px) { ... css setting another background color for the same element

我通过实验发现979/980以上的数值，也就是说，这些数值似乎是我手机的数值，也就是说，如果我增加或减少这两个数值，我会注意到另一个数值会被应用

但是，我不认为我应该通过实验来找出这些边界值，而是认为我应该能够使用以下javascript：

 document.write('<br>your resolution is ' + screen.availWidth + ' , ' + screen.availHeight);

document.write（“
您的分辨率为“+screen.availWidth+”，“+screen.availHeight”）；

上述检测到的javascript宽度值与媒体查询中实际使用的值（854而不是979）相差100多像素

因此，我的问题是，考虑到“screen.availWidth”显然不起作用（而“screen.width”也不起作用），我如何使用javascript（或服务器端代码）计算设备宽度，以及一个在媒体查询中有用的值

我的手机是索尼爱立信Xperia Arc S，我使用的操作系统是安卓4.0.4。 我使用以下三种浏览器进行了此实验： -铬18.0.1025.166 -火狐14.0 -“Opera/9.80版本/12.00”（不确定9.80是什么意思，但我猜版本是12.00，这个字符串是我从javascript‘navigator.userAgent’获得的）

Chrome浏览器使用上面提到的javascript显示这些宽度/高度值：480 x 854或854 x 480（取决于我是在纵向还是横向中握住它） Firefox浏览器显示的宽度/高度值与上面的Chrome相同。 Opera浏览器横向显示宽度/高度854 x 439，纵向显示宽度/高度480 x 658

---

但是，当尝试如上所述应用CSS3媒体查询时，所有这些浏览器似乎都使用值979而不是854。

服务器端：否。客户端：查看web上的许多媒体查询模拟库！