CSSMediaRule - @mediaのCSSルール

2017/10/15

CSSMediaRuleは、@mediaのCSSルールを管理するための機能を備えたインターフェイスです。

概要

名前

CSSMediaRule

継承

IDL

[Exposed=Window]
interface CSSMediaRule : CSSConditionRule {
    [SameObject, PutForwards=mediaText] readonly attribute MediaList media;
};

仕様書

https://drafts.csswg.org/css-conditional-3/#cssmediarule

CSSMediaRuleは、CSSRuleListの各インデックスに含まれています。先にStyleSheetList、CSSStyleSheet、CSSRuleList、CSSRuleを理解して下さい。下記のような@mediaのCSSルールがCSSMediaRuleです。

@media screen and (min-width:250px) {
	p#hoge { color: red ; }
	p#hoge { background-color: #fffff0 ; }
}

コンストラクタはありません。

@mediaのクエリをMediaListで返します。

固有のメソッドはありません。

固有の定数はありません。

固有のイベントハンドラはありません。

クリックすると、バージョンごとの対応状況を確認できます。

Features	Chrome	Firefox	Safari	Edge	IE	Opera	iOS Safari	Android
CSSMediaRule	●	●	●	●	● 9+	●	●	●
media	●	●	●	●	● 9+	●	●	●