Edit

Page

Page title:

Page body:

* 仕様書

[REFS[
- [48] [CITE@en[Media types]] ([TIME[2011-06-07 13:09:52 +09:00]] 版) <http://www.w3.org/TR/CSS21/media.html>
- [36] [CITE@en[Media Queries Level 4]] ([TIME[2013-07-25 22:52:42 +09:00]] 版) <http://w3c-test.org/csswg/mediaqueries/#error-handling>
]REFS]

* 媒体型の一覧

[FIG(short list)[
[53] 
- [CODE(CSS)@en[[[all]]]]
- [CODE(CSS)@en[[[mixi-device-au]]]]
- [CODE(CSS)@en[[[aural]]]]
- [CODE(CSS)@en[[[braille]]]]
- [CODE(CSS)@en[[[csshttprequest]]]]
- [CODE(CSS)@en[[[dark]]]]
- [CODE(CSS)@en[[[mixi-device-docomo]]]]
- [CODE(CSS)@en[[[emacs]]]]
- [CODE(CSS)@en[[[emboss]]]]
- [CODE(CSS)@en[[[embossed]]]]
- [CODE(CSS)@en[[[handheld]]]]
- [CODE(CSS)@en[[[amzn-kf8]]]]
- [CODE(CSS)@en[[[light]]]]
- [CODE(CSS)@en[[[mixi-device-mobile]]]]
- [CODE(CSS)@en[[[amzn-mobi]]]]
- [CODE(CSS)@en[[[oxygen]]]]
- [CODE(CSS)@en[[[-o-page]]]]
- [CODE(CSS)@en[[[print]]]]
- [CODE(CSS)@en[[[projection]]]]
- [CODE(CSS)@en[[[reader]]]]
- [CODE(CSS)@en[[[screen]]]]
- [CODE(CSS)@en[[[mixi-device-smartphone]]]]
- [CODE(CSS)@en[[[mixi-device-softbank]]]]
- [CODE(CSS)@en[[[speech]]]]
- [CODE(CSS)@en[[[tty]]]]
- [CODE(CSS)@en[[[tv]]]]
- [CODE(CSS)@en[[[atsc-tv]]]]
- [CODE(CSS)@en[[[dde-tv]]]]
- [CODE(CSS)@en[[[dvb-tv]]]]
- [CODE(CSS)@en[[[xemacs]]]]
]FIG]

* 媒体クエリーでの評価

[37] [[媒体クエリー]]で[[媒体型]]が指定された場合、[[利用者エージェント]]の[[装置]]が指定された[[媒体型]]と一致すれば[[真]]、一致しなければ[[偽]]となります。

[38] 特別な[[媒体型]]である [CODE(CSS)@en[[[all]]]] はすべての[[媒体型]]と一致するとみなされます。

[39] [CODE(CSS)@en[[[not]]]]、[CODE(CSS)@en[[[and]]]]、[CODE(CSS)@en[[[or]]]]、
[CODE(CSS)@en[[[only]]]] は予約語となっており、[[媒体型]]とはみなされず構文エラーになります。 [SRC[>>36]]

;; [40] このうち [CODE(CSS)@en[[[or]]]] は他の用途で使われていません。

;; [46] [[Gecko]] は構文エラーとみなさず、 [[CSSOM]] に現れます。 [[Chrome]] は [CODE(CSS)@en[[[or]]]]
を構文エラーとみなしませんがそれ以外はみなします。

[41] 未知の[[媒体型]]は、[[偽]]と評価されます。 [SRC[>>36]]

;; [42] 不正なものとして無視されるのではなく、[[偽]]となります。従って
[CODE(CSS)@en[[[not]] unknown-media-type]] は[[真]]になります。

[43] [[CSSOM]] 上も未知の[[媒体型]]はそのまま現れます。 (全体が無視されるわけではありません。)

;; [44] [[Chrome]]、[[Firefox]] [TIME[2013-08-03T02:06:20.300Z]]

* 適合性

[49] [[媒体クエリー]]が[[適合]]するためには、[[媒体型]]は適当な仕様に適合するものである必要があります。
[SRC[<http://w3c-test.org/csswg/mediaqueries/#syntax>]]

;; [50] >>49 のような「事実の文」はありますが、現代的な仕様ならあるべき明確な適合性の規定はどこにもありません...

* メモ

[4] [DFN[媒体記述子 (media descriptor)]] 
は、[[媒体]]の種類を表す名前です。

[5] [[HTML 4]] や [[CSS]] では媒体型 (media type) とも呼びます
(特に CSS では媒体型とのみ呼びます) が、[[媒体型]]というと [[MIME]]
の Internet Media Type (Content Type) 
を指すこともありますから、ここでは媒体記述子と呼びます。

なお、 HTML 4 では後者を[[内容型]] (Content Type)
と呼ぶことではっきり区別しています。

[23] CSS3 では条件判断を含めて拡張した''媒体問合せ'' (media query)
を導入しています。

[24] [[HTML]] / [[XML]] の媒体型と [[CSS]] 
の媒体型は、ほとんど値や定義が同じですが、同じものだという規定はどこにもありません。
ですから CSS2 にある [CODE(CSS)[embossed]] という値を HTML 4
や XML で使って良いのか判断できません。
>>21 の CSS3 draft の内容を見れば、 [[W3C]]
的には同じ値をとり得ることは明らかですから、現状で不明瞭なのは単に
HTML と CSS の制定時期の関係だと思われます。

XHTML2 の draft は CSS2 を参照していますから、この状況は改善されるでしょう。

[35]
>>24
とかいってると

[CITE[HTML Working Group Voyager Issue Tracking System - Modularization-text/8302]] 
<http://hades.mn.aptest.com/cgi-bin/voyager-issues/Modularization-text?id=8302>

のようなくだらない問題を引き起こすんだよねぇw
([[名無しさん]] [sage])

[[#comment]]

* (X)HTML

[6] HTML 4 では、 [[link]] 要素の [[media]] 
属性の値として使い、リンク先文書の媒体を示します。

主に、外部[[スタイル・シート]]の適用媒体を指定するのに使いますが、他の[[リンク型]]に対しても使えます。

HTML 4 を [[XML]] 化した [[XHTML]]1 でも同様に使えます。

[9] [[style]] 要素にも [CODE(HTML)[media]] 属性があります。
(こちらはもちろんスタイル・シート専用です。)

[10] 仕様には既定値は [CODE(HTML)[screen]] だと書いてありますが、
[[DTD]] には載っていません。
([CODE(HTML)[all]] ではないんだ。)

[22] >>10 XHTML2 の draft は既定値を [CODE(CSS)[all]]
にしています。

[11] [CODE(HTML)[media]] 属性の値 [CODE(HTML)[%MediaDesc;]]
は媒体型を読点区切りで列挙したものですが、 HTML4 
では、将来の版の拡張を想定した解析方法を規定しています。

- [7] ''Basic HTML data types: Media descriptors'' <http://www.w3.org/TR/html4/types.html#type-media-descriptors>
- [8] ''Style Sheets in HTML documents: Media types'' <http://www.w3.org/TR/html4/present/styles.html#h-14.2.4>
- [[XHTML m12n]]
-- [CSECTION[4.3. Attribute Types]]
<IW:XHTML1m12n:"abstraction.html#dt_MediaDesc">

- [12] >>7 では ''case-sensitive'' と書かれていますが、 ''case-insensitive'' にリンクされています。 [CODE(HTML)[media]] 属性の定義と照らし合わせると大文字・小文字は区別しないのが正しいと思われます。 (HTML4 Errata になし。)
- [1] ''XHTMLからメタデータを自動抽出する'' <http://www.kanzaki.com/docs/sw/xh2meta.html#xslt-pi> [CODE[meta]] が提案されています。
[[#comment]]

** 媒体型の値

:all:全ての機器
:aural:発話合成器
:braille:点字凹凸 feedback 機器
:handheld:handheld 機器 (小画面, [[白黒]], ビットマップ画像, 限られた[[帯域]])
:print:頁付けされた不透明なもの及び画面上での印刷[RUBY[予見] [プレビュー]]モードでの表示
:projection:投影機
:screen:[[頁]]付けされていない計算機画面
:tty:[[固定幅]]文字枠を使う媒体。[[テレタイプ]], [[端末]], 限られた表示能力の[[携帯機器]]など
:tv:[[テレビ]]型機器 (低[[解像度]], 多色, 限られたスクロール能力)
:[CODE(CSS)[[[atsc-tv]]]]:ATSC DASE 利用者エージェント [SRC[DASE]]]
:[CODE(CSS)@en[[[csshttprequest]]]]:[[CSSHttpRequest]]

** 解釈

[34] HTML 4 は、 [CODE(HTMLa)[[[media]]]] 属性の構文解析に際し、将来の拡張を見越して次の処理を適合利用者エージェントに義務付けています。
(<IW:HTML4:"types.html#type-media-descriptors"> 参照。)

= 値を実体の読点分離並びとして解釈する。[WEAK[仕様書の例示によれば、読点の直後の空白も分離子に含まれる。]]
= [CODE(regex)['''['''A-Za-z0-9-''']''']] 以外の最初の文字の直前までに丸める。
= 大文字・小文字を区別して定義された媒体型との一致を試みる。
一致しなければ無視する。

[[#comment]]

* CSS

** CSS2

[13] [[CSS]] は level 2 で媒体型の考え方を導入しました。

[15] CSS2 で媒体型の値を指定できる場所は、 [[@import]]
と [[@media]] の2箇所です。例:

[PRE[
 @import 'foo.css' screen;
 @media screen, print {
   .foo {display: none}
 }
]PRE]

[17] CSS2 は、技術の進歩は早いので [CODE(CSS)[@media]]
で指定できる媒体型の値の完全な一覧は定義しないとしています。
従って、 CSS2 仕様書にない値を使うことは必ずしも問題ではありません。

しかし無闇に仕様外の値を使うことは望ましくないでしょう。
どうしても仕様にない値を使う場合は、 [SAMP(CSS)[-foo-medianame]]
のように明らかに非標準であることが分かる名前を選ぶといいかもしれません。

[18] CSS2 附属書 D を元にした [[ABNF]] での構文:
- media-types = medium *([FWS] "," [FWS] medium) [FWS]
- medium = [[IDENT]]

[19] >>18 の構文からすれば >>18 の例は不正ですが、 [[-moz-*]]
のような拡張属性名・属性値を考えれば問題ないでしょう。

[20] 媒体型は大文字・小文字を区別しません。

[16] CSS2 は媒体型に加えて媒体組 (media group)
を定義しています。
これは媒体型のようにスタイル・シートなどに記述するものではなく、仕様書の説明のためのもののようです。
(媒体型同様に使えるとはかかれていませんし、構文などに登場しませんし、
W3C の Validator でも error がでます。)

- [14] ''Media types'' <http://www.w3.org/TR/REC-CSS2/media.html>
- [2] ''CSS2 メディアタイプ・ノート'' <http://is.vis.ne.jp/notes/css2_syndata/css2_media_types.xhtml>
- [3] ''CSS2 @ルールなど・対応表: @mediaルール'' <http://is.vis.ne.jp/charts/css2_rules/index.xhtml#at_media>
- [33] ''SkankWorks・2003年6月・メディアごとのスタイルシート'' <http://anoh.s10.xrea.com/03-06.php#d2003-06-08c1>: ブラウザがスタイル・シートの適用時に媒体名を見てどうするかについて。
[[#comment]]

** 媒体型の値

:all:全ての機器
:aural:発話合成器
:braille:点字凹凸 feedback 機器
:dark:利用者が暗い背景色を使っているとき [Emacs/W3]
:emacs:[[Emacs]] 19 (なぜに 19?) [Emacs/W3]
:embossed:頁付けのある点字印刷機
:handheld:handheld 機器 (典型的には小画面, 白黒, 限られた帯域)
:light:利用者が薄い背景色を使っているとき [Emacs/W3]
:[CODE(CSS)@en[[[oxygen]]]]:[[Oxygen]] [SRC[Oxygen]]
:print:頁付けされた不透明なもの及び画面上での印刷[RUBY[予見] [プレビュー]]モードでの表示
:projection:投影表現用。投影機又は透明なものへの印刷
:screen:主に色付けられる計算機画面
:speech:-> [CODE(CSS)[aural]] [Emacs/W3]
:tty:固定幅文字枠を使う媒体。テレタイプ, 端末, 限られた表示能力の携帯機器など ([[ピクセル]]単位を使用するべきではない)
:[CODE(CSS)[[[atsc-tv]]]]:ATSC DASE 利用者エージェント [SRC[DASE]]
:[CODE(CSS)[[[dde-tv]]]]:ARSC DDE 利用者エージェント [SRC[DDE]]
:[CODE(CSS)[[[dvb-tv]]]]:[[MHP]] 端末 [MHP 1.1]
:tv:テレビ型機器 (低解像度, 多色, 限られたスクロール能力の画面, 音声が利用可能)
:xemacs:[[XEmacs]] 19 (なぜに 19?)

[31] 多分 (X)Emacs 19 なのはそういう時代に [SRC[Emacs/W3]]
の文書が書かれたからで、今の版でも有効なんじゃ?

[32] [[CSS 2]] 附属書 A のスタイル・シートの例では [CODE(CSS)[aural]] 
とすべきところが誤って [CODE(CSS)[speech]] になってます 
(''Errata in REC-CSS2-19980512'' <http://www.w3.org/Style/css2-updates/REC-CSS2-19980512-errata.html>)。
このスタイル・シート片はそもそも [[Emacspeak]] 
の作者のものを採ったらしいです。なるほど。

[[#comment]]

** 媒体組の値

:continuous:継続
:paged:頁付け
:visual:視覚的
:aural:聴覚的
:tactile:触覚的
:grid:枠あり (文字枠機器)
:bitmap:ビットマップ (表示位置を自由に設定できる)
:interactive:対話型 (利用者の操作を得られる機器)
:static:静的 (利用者の操作を得られない)
:all:全て

,	,連続性	,対象感覚	,配置の自由性	,動的か静的か
,aural	,continuous	,aural	,なし	,両方
,braille	,continuous	,tactile	,grid	,両方
,[CODE(CSS)[dvb-tv]]	,continuous	,visual	,bitmap	,両方
,emboss[INS[ed]]	,paged	,tactile	,grid	,両方
,handheld	,両方	,visual	,両方	,両方
,print	,paged	,visual	,bitmap	,static
,projection	,paged	,visual	,bitmap	,static
,screen	,continuous	,visual	,bitmap	,両方
,tty	,continuous	,visual	,grid	,両方
,tv	,両方	,visual & aural	,bitmap	,両方

[[#comment]]

** CSS3

[21] CSS3 draft の1つ, ''Media Queries'' 
<http://www.w3.org/TR/css3-mediaqueries/> (2003年2月の時点で [[CR]])
は、''媒体問合わせ (media query)'' として HTML4/CSS2
の媒体型を拡張しています。
[[#comment]]

* emboss 問題

[25] 点字媒体を表す CSS 2 で導入された媒体名は [CODE(CSS)[embossed]]
ですが、媒体組の説明が誤って [CODE(CSS)[emboss]]
になっているという致命的な問題があります。

このため、 CSS の解説は [CODE(CSS)[emboss]] と [CODE(CSS)[embossed]]
に割れてしまっています。また、媒体名と媒体組の説明をそれぞれ仕様書に忠実に書いたために、仕様書同様同一文書中に2種類が混在している説明も多数存在します。

<del>
- [26] ''君は夜空の青い彗星日記'' <http://ayakamoe-web.hp.infoseek.co.jp/diary/diary.html#diary20021218>
</del>
<http://ayakamoe.s26.xrea.com/diary/diary2002B.xhtml#diary20021218> [TIME[2010-10-31T01:52:54.300Z]]

- [27] ''@規則 一覧'' <http://www6.plala.or.jp/go_west/css2/ref/atrl.htm#m>
[[#comment]]

* メモ

- [28] ''CSS-guide, proposals: XCSS'' <http://www.nic.fi/~tapio1/Teaching/XCSS.php3>: この文書の中で、 [CODE[IE55]] や [CODE[Nokia]] のような媒体名を使った [[UA]] 振り分けが提案されています。もっとも、このまま使うには UA 名の一意性をどうするかとか問題があります。
- [29] [[Opera]] 7 では、全画面表示モードで [CODE[projection]] を適用します。
- [30] ''Bug 120398 - RFE: ability to specify 'projection' CSS2 media'' <http://bugzilla.mozilla.org/show_bug.cgi?id=120398>: [[Mozilla]] で >>29 に追随しようという議論
- [Emacs/W3] ''Emacs/W3 $State: Exp $ User's Manual - Media Selection'' <http://www.cs.indiana.edu/elisp/w3/docs/w3_54.html>
- [DASE] [CITE[DTV A S E L 1 (DASE-1) P 2: D A E ATSC Standard]] <http://www.atsc.org/standards/a_100_2.pdf>
- [DDE] [CITE[Declarative Data Essence -- Transitional]] 
<http://www.smpte.org/standards/pdf/s397m.pdf>

[45] かつて [[WinIE]] と [[Opera]] は未知の[[媒体型]]を [[CSSOM]] 上 [CODE(CSS)@en[[[unknown]]]]
に置き換えていました。

[51] [CITE@en[Bug 23610 – In the tag cloud example, the inline counts of the tags should be "hidden" off-screen (e.g. position: relative; left: -3000em) rather than using display: none. This way, the information will not be hi ''''''[''''''...'''''']'''''']]
( ([TIME[2013-10-26 20:47:23 +09:00]] 版))
<https://www.w3.org/Bugs/Public/show_bug.cgi?id=23610#c3>

[52] [CITE@ja[技術仕様 << mixi Developer Center (ミクシィ デベロッパーセンター)]]
( ([TIME[2013-11-29 01:57:33 +09:00]] 版))
<http://developer.mixi.co.jp/connect/mixi_plugin/mixi_check/spec_mixi_check/>

[47] [CITE@en[Drop the "Media:" entry from propdef tables]]
([[frivoal]]著, [TIME[2018-07-06 11:29:25 +09:00]])
<https://github.com/w3c/csswg-drafts/commit/951fc349f63ce196e3f9b4f4a0213db6e76b1f10>

[54] [CITE@en[Replace Media:all in propdef tables with prose]]
([[frivoal]]著, [TIME[2018-07-06 11:50:12 +09:00]])
<https://github.com/w3c/csswg-drafts/commit/930a89b5b7c3b0727bd170833fd5465c191d47b1>

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Errors

Page name(s)