CSS和Javascript媒体查询检测

时间:2012-12-27 18:51:19

标签: javascript jquery css media-queries

http://www.w3.org/TR/css3-mediaqueries/我们可以看到有很多方法来声明媒体查询,例如:

(1)@media screen and (min-width: 400px) and (max-width: 700px) { … }

(2)@media handheld and (min-width: 20em), screen and (min-width: 20em) { … }

(3)@media screen and (device-aspect-ratio: 16/9) { … }

(4)@media screen and (device-width: 800px) { … }

等等。

我想知道在javascript或浏览器中是否有任何方式我们可以找到某些媒体查询适用的宽度范围。

例如(1)将介于400和700之间,(4)恰好为800

解析媒体查询字符串以确定此信息似乎很乏味。有更简单的方法吗?

1 个答案:

答案 0 :(得分:1)

试试这个媒体查询书签:http://fhemberger.github.com/mediaquery-bookmarklet/