实例属性
继承其祖先 CSSConditionRule、CSSGroupingRule 和 CSSRule 的属性。
CSSMediaRule.media只读-
返回一个
MediaList,表示样式信息的预期目标介质。
实例方法
没有特定的方法;继承自其祖先 CSSConditionRule、CSSGroupingRule 和 CSSRule 的方法。
示例
下面的 CSS 包含一个带有单个样式规则的媒体查询。MDN 实时示例基础设施将示例中的所有 CSS 块合并到一个带有 ID css-output 的内联样式中,因此我们首先使用 document.getElementById() 来查找该样式表。myRules[0] 返回一个 CSSMediaRule 对象,我们可以从中获取 mediaText。
html
<p id="log"></p>
css
@media (width >= 500px) {
body {
color: blue;
}
}
js
const log = document.getElementById("log");
const myRules = document.getElementById("css-output").sheet.cssRules;
const mediaList = myRules[0]; // a CSSMediaRule representing the media query.
log.textContent += ` ${mediaList.media.mediaText}`;
规范
| 规范 |
|---|
| CSS 条件规则模块第 3 级 # the-cssmediarule-interface |
浏览器兼容性
加载中…