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

HTMLタグ一覧

HTMLスタイルメディア属性

media属性指定CSS样式针对哪种媒体/デバイスが最適化されています。この属性は、特殊なデバイス（例えばiPhone）や音声、印刷メディア用のスタイルを指定するために使用されます。

オンラインサンプル

印刷用のスタイルを指定する：

例

!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8>
<title>HTML　ソース　メディア属性の使用-基本チュートリアル(oldtoolbag.com)</title>
style　media="print">
h1　{color:#000000;}
p　{color:#000000;}
body　{background-color:#FFFFFF;}
</style>
</head>
body
h1oldtoolbag.com　例/h1>
<p>如果您打印此页面，或在打印预览中打开它，则将看到它使用media　=“　print”样式表进行样式设置。“打印”样式表包含白色背景上的黑色文本。</p>
</body>
</html>

测试看看 ‹/›

浏览器兼容性

IEFirefoxOperaChromeSafari

所有主流浏览器都支持 media 属性。

定义和用法

media属性指定CSS样式针对哪种媒体/设备进行了优化。
此属性用于指定样式用于特殊设备（例如iPhone），语音或印刷媒体。
提示：此属性可以接受多个值。

HTML 4.01 与 HTML5之间的差异

没有。

语法

<style 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" or "landscape" 例：media="all and (orientation: landscape)"
aspect-ratio	指定目标显示区域的宽度/高度比「min」を使用できます。-" と "max-" プレフィックス。例：media="screen and (aspect-ratio:16/9)"
device-aspect-ratio	ターゲットディスプレイを指定します。/纸张的 device-width/device-height 比率「min」を使用できます。-" と "max-" プレフィックス。例：media="screen and (aspect-ratio:16/9)"
color	指定目标显示器的 bits/color 「min」を使用できます。-" と "max-" プレフィックス。例：media="screen and (color:3)"
color-index	ターゲットディスプレイが処理できる色数を指定します。「min」を使用できます。-" と "max-" プレフィックス。例：media="screen and (min-color-index:256)"
monochrome	指定する単色フレームバッファの bits/pixel 「min」を使用できます。-" と "max-" プレフィックス。例：media="screen and (monochrome:2)"
resolution	ターゲットディスプレイを指定します。/紙のピクセル密度 (dpi または dpcm) 「min」を使用できます。-" と "max-" プレフィックス。例：media="print and (resolution:300dpi)"
scan	tv 表示器のスキャン方法を指定します。可能な値："progressive" と "interlace"。例：media="tv and (scan:interlace)"
grid	出力デバイスがグリッドまたはビットマップであるかを指定します。可能な値："1" がグリッドの場合、それ以外は "0" です。例：media="handheld and (grid:1)"

　HTML <style> タグ

HTML: <template> タグ