HTML リファレンスマニュアル

HTML 标签大全

HTML: <area> media 属性

media属性は、ターゲットURLがどのメディアに対して最適化されているかを指定します。/デバイスが最適化されており、この属性は特定のデバイス（例えばiPhone）や音声、印刷媒体用のURLを指定するために使用されます。この属性は複数の値を受け入れます。

　HTML <area> タグ

在线示例

具有可点击区域的图像地图：

示例

!DOCTYPE　html>
<html>
<title>HTML:<area>　media　属性　-　基础教程网　oldtoolbag.com</title>
<body>
<p>单击太阳以近距离观看</p>
<img　src="planets.gif"　width="145"　height="126"　alt="Planets"　usemap="#planetmap">
<map　name="planetmap">
　　<area　shape="rect"　coords="0,0,82,126"　alt="Sun"　href="sun.html"　media="screen　and　(min-color-index:256)">
</map>
</body>
</html>

テストを見てみましょう ‹/›

ブラウザの互換性

IEFirefoxOperaChromeSafari

すべての主要ブラウザがmedia属性をサポートしています。

定義と用法

media属性は、ターゲットURLがどのメディアに対して最適化されているかを指定します。/デバイスが最適化されています。
この属性は、特別なデバイス（例えばiPhone）、音声や印刷メディア向けのURLを指定するために使用されます。
この属性は複数の値を受け入れます。
href属性が存在する場合にのみ使用してください。
注意：この属性は纯粹に推奨的なものです。

HTML 4.01 HTML5の間の違い

media属性はHTML5に新しい属性が追加されました。

文法

<area media="value>

可能なオペレータ

値	説明
and	指定 AND オペレータ
not	指定 NOT オペレータ
,	指定 OR オペレータ

デバイス

値	説明
all	デフォルト。すべてのデバイスに適応。
aural	オーディアル合成器
braille	ブラailleフィードバックデバイス
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)"
方向	ターゲットディスプレイを指定/紙の方向。可能な値: "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	出力デバイスを電力網またはビットマップに指定 gridの値は "1", その他は "0" 例: media="handheld and (grid:1)"

　HTML <area> タグ

HTML: <template> タグ