Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

Window.matchMedia()

概要

返回一个新的MediaQueryList 对象,表示指定的媒体查询字符串解析后的结果。

语法

mql = window.matchMedia(mediaQueryString)

其中mediaQueryString参数是一个字符串,表示即将返回一个新MediaQueryList对象的媒体查询。

举例

if (window.matchMedia("(min-width: 400px)").matches) {
  /* the view port is at least 400 pixels wide */
} else {
  /* the view port is less than 400 pixels wide */
}

当窗口非常有限的情况下,这段代码让你可以针对不同情况进行处理事情。

参考更多的例子来 通过代码使用媒体查询

浏览器通用性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 9 6.0 (6.0) 10 12.1 5.1
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 3.0 6.0 (6.0) 未实现 12.1 5

详述

请参阅

文档标签和贡献者

 此页面的贡献者: teoli, focus, ziyunfei
 最后编辑者: focus,