例
使用media属性：
<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
»それを自分で試してみてください 定義と使用法
media属性は、（ファイルがために最適化されているものメディア/デバイス）メディアリソースのタイプを指定します。
ブラウザは、それがファイルを再生することができるかどうかを決定するために、この属性を使用することができます。 それができないなら、それはそれをダウンロードしないように選択することができます。
注：この属性は複数の値を受け入れることができます。
ブラウザのサポート
| 属性 | |||||
|---|---|---|---|---|---|
| media | サポートされていません | サポートされていません | サポートされていません | サポートされていません | サポートされていません |
HTML 4.01とHTML5の違い
<source>タグは、HTML5で新しく追加されました。
構文
<source media="value">
可能なOperators
| 値 | 説明 |
|---|---|
| and | AND演算子を指定します |
| not | NOT演算子を指定します。 |
| , | OR演算子を指定します。 |
デバイス
| 値 | 説明 |
|---|---|
| all | すべてのデバイスに適しています。 これがデフォルトです |
| aural | スピーチシンセサイザー |
| braille | 点字フィードバック装置 |
| handheld | ハンドヘルドデバイス（小さな画面、限られた帯域幅） |
| projection | プロジェクター |
| 印刷プレビューモード/印刷されたページ | |
| screen | コンピュータ画面 |
| tty | 固定ピッチの文字格子を使用して、テレタイプと同様のメディア |
| tv | テレビ型デバイス（低解像度、制限されたスクロール機能） |
価値観
| 値 | 説明 |
|---|---|
| width | 対象となる表示領域の幅を指定します。 "min-"と"max-"接頭辞を使用することができます。 例： media="screen and (min-width:500px)" |
| height | 対象となる表示領域の高さを指定します。 "min-"と"max-"接頭辞を使用することができます。 Example: media="screen and (max-height:700px)" |
| クラス= "notranslate"デバイス幅 | ターゲット表示/紙の幅を指定します。 "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 | ターゲット表示/紙の画素密度（解像度またはDPCM）を指定します。 "min-"と"max-"接頭辞を使用することができます。 例： media="print and (resolution:300dpi)" |
| scan | テレビディスプレイの走査方法を指定します。 可能な値は"progressive"と"interlace" 。 例： media="tv and (scan:interlace)" |
| grid | 出力デバイスがグリッドまたはビットマップであるかどうかを指定します。 可能な値は"1"グリッド、および"0"そうでありません。 例： media="handheld and (grid:1)" |