Source media属性

定義と用法

media <source>要素内のmedia属性の値を設定または返します。

<source> media属性 メディアリソースのタイプを規定します(ファイルがどのメディア/デバイスに最適化されているか)。

ブラウザはmedia属性を使用して、ファイルを再生できるかどうかを確認します。再生できない場合は、ダウンロードをスキップすることができます。

HTML 参考マニュアル:HTML <source> タグ

特定のファイルがどのメディア/デバイスに最適化されているかを返します:

var x = document.getElementById("mySource").media;

自分で試してみてください

構文

media属性を返します:

sourceObject.media

media属性を設定します:

sourceObject.media = value

注記:この属性は複数の値を受け入れます。

可能な演算子

説明
and 規定 AND 演算子。
not 規定 NOT 演算子。
, 規定 OR 演算子。

デバイス

説明
all すべてのデバイスに適用。デフォルト。
aural 音声合成器。
braille 点字反応装置。
handheld ハンドヘルドデバイス(小さなスクリーン、限られたバンド幅)。
projection プロジェクター
print 印刷プレビューモード/印刷ページ。
screen コンピュータのスクリーン。
tty 固定間隔のキャラクターグリッドを使用する電報伝打ち機や類似のメディア。
tv テレビ型のデバイス(低解像度、限られたスクロール能力)。

属性値

説明
width

ターゲット表示領域の幅を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (min-width:500px)"

height

ターゲット表示領域の高さを指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (max-height:700px)"

device-width

ターゲットディスプレイ/紙の幅を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (device-width:500px)"

device-height

ターゲットディスプレイ/紙の高さを指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (device-height:500px)"

orientation

ターゲットディスプレイ/紙の方向を指定します。

可能な値:「portrait」または「landscape」です。

例:media="all and (orientation: landscape)"

aspect-ratio

ターゲット表示領域の幅高比を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (aspect-ratio:16/9)"

device-aspect-ratio

ターゲットディスプレイ/紙のデバイス幅/デバイス高さ比を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (aspect-ratio:16/9)"

color

ターゲットディスプレイの各色のビット数を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (color:3)"

color-index

ターゲットディスプレイが処理できる色数を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (min-color-index:256)"

monochrome

単色フレームバッファー中の各ピクセルのビット数を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="screen and (monochrome:2)"

resolution

ターゲットディスプレイ/紙のピクセル密度(dpiまたはdpcm)を指定します。

「min-」および「max-」接頭辞を使用できます。

例:media="print and (resolution:300dpi)"

scan

テレビディスプレイのスキャン方法を指定します。

可能な値は「progressive」および「interlace」です。

例:media="tv and (scan:interlace)"

grid

出力デバイスがグリッドまたはビットマップであることを指定します。

グリッドの可能値は「1」で、それ以外は「0」です。

例:media="handheld and (grid:1)"

技術的詳細

返り値: メディアリソースのタイプを示す文字列値。

ブラウザサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート サポート サポート サポート サポート

注記:しかし、主要なブラウザのどれも HTML media 属性をサポートしていません。

関連ページ

HTML 参考マニュアル:HTML <source> メディア属性