このドキュメントの正式版はW3Cのサイト上にある英語版であり、このドキュメントには翻訳に起因する誤りがありえます。誤訳、誤植などのご指摘は、訳者までお願い致します。<annevk@opera.com>このドキュメントに対する正誤表を参照してください。いくつかの規範的な修正が含まれているかもしれません。翻訳版も参照してください。apply.要約HTML4とCSS2は現在、異なるメディア・タイプに応じたメディア固有のスタイル・シートをサポートしています。ドキュメントでは、画面上での表示にはsans-serifフォントを使用し、印刷時にはserifフォントを使用できます。「screen」と「print」は、2つの定義済みのメディア・タイプです。メディア・クエリは、スタイル・シートのより精緻なラベル付けを可能にすることにより、メディア・タイプの機能を拡張します。メディア・クエリは、メディア・タイプと、特定のメディア特性の状況をチェックする0以上の式で構成されます。メディア・クエリで使用できるメディア特性には、「width」(幅)、「height」(高さ)、「color」(色)などがあります。メディア・クエリを用いると、コンテンツ自体を変更せずに、出力デバイスの固有の範囲に合わせた表示を実現できます。このドキュメントのステータスこの項は、このドキュメントの公開時のステータスについて記述しています。他のドキュメントがこのドキュメントに取って代わることがありえます。現行のW3Cの刊行物およびこの技術報告の最新の改訂版のリストは、http://www.w3.org/TR/のW3C技術報告インデックスにあります。W3C勧告は、実装可能となるよう広くレビューされ公開されてきた成熟したドキュメントです。W3Cは、全ての人に対し、この仕様の実装を奨励します。この仕様に関する議論には、公開メーリングリストwww-style@w3.org(アーカイブ)の利用をお勧めします(手引きを参照)。comment...の要領で)。このドキュメントは、W3Cメンバー、ソフトウェア開発者、他のW3Cグループ、および他の利害関係者によりレビューされ、W3C勧告として管理者の協賛を得ました。これは確定済みドキュメントであり、参考資料として用いたり、別のドキュメントで引用することができます。勧告の作成におけるW3Cの役割は、仕様に注意を引き付け、広範囲な開発を促進することです。これによってウェブの機能性および相互運用性が増強されます。ワーキンググループの実装報告書およびメディア・クエリのテスト・スイートを参照してください。コメントの処理および前の勧告案に対する変更のリストも参照してください。W3C勧告としての公開は、W3Cメンバーによる承認を意味しません。これは草案ドキュメントであるため、他のドキュメントによって、随時更新されたり、置き換えられたり、廃止されることもあります。作業中以外のものとしてこのドキュメントを引用することは適当ではありません。Activity)の一部)によって作成されました。このドキュメントは、2004年2月5日のW3C特許方針の下で活動しているグループによって作成されました。このドキュメントには、参考情報のみが含まれています。W3Cは、このグループの成果物に関連するあらゆる特許の開示の公開リストを維持し、このページには特許の開示に関する指示も含まれています。Claim(s))を含んでいると思われる特許に関して実際に知っている人は、W3C特許方針の6項に従って情報を開示しなければなりません。このドキュメントは、スタイル・シートと、タイトル、日付およびより古い変更の項の削除などの前付け部分の編集上の変更を除き、前の勧告案バージョンと同じです。背景(この項は規範的ではありません。)HTML4[HTML401]およびCSS2[CSS21]は現在、異なるメディア・タイプに応じたメディア固有のスタイル・シートをサポートしています。ドキュメントでは、画面と印刷に異なるスタイル・シートを使用できます。HTML4では、これは次のように記述できます。href="serif.css">CSSスタイル・シート内では、特定のメディア・タイプを適用する部分を宣言できます。}}「print」(印刷)と「screen」(画面)のメディア・タイプが、HTML4で定義されています。HTML4のメディア・タイプを全て列挙すると、「aural」(音声)、「braille」(点字)、「handheld」(携帯端末)、「print」(印刷)、「projection」(プロジェクタ)、「screen」(画面)、「tty」(固定文字幅)、「tv」(テレビ)です。CSS2も同じリストを定義しながら、「aural」を非推奨とし、「embossed」(点字印刷)と「speech」(音声)を追加しています。「all」(すべて)は、スタイル・シートがすべてのメディア・タイプに適用されることを示すために用いられます。メディア固有のスタイル・シートは、複数のユーザ・エージェントでサポートされます。一般的に用いられる機能は、「screen」と「print」を区別するというものです。どの種類の出力デバイスにスタイル・シートを適用するかをより詳細に記述する方法が要望されていました。HTML4はこれらの要望を予期し、メディア・タイプに対し上位互換性のある構文を定義していました。ここで、HTML4の6.13項を引用します。HTMLの将来のバージョンでは、新しい値が導入される可能性や、パラメター化された値が認められる可能性があります。これらの拡張を導入できるようにするためには、適合するユーザ・エージェントは、次のようにmedia属性値を解析できなければなりません。値は、コンマで区切られた項目のリストにします。90dpi"は、次のとおりにマッピングされます。ASCII文字[a-zA-Z](Unicodeの10進の65~90、97~122)、数字[0-9](Unicodeの16進の30~39)、またはハイフン(45)以外の最初の文字の直前で切り捨てられます。ここの例では、次のとおりとなります。"screen""3d-glasses""print"この仕様で記述しているメディア・クエリは、HTML4で記述されているメカニズムを基礎としています。メディア・クエリの構文は、HTML4で予約されているメディア・タイプの構文に適合しています。HTML4のmedia属性は、XHTMLや一般的なXMLにも存在しています。同じ構文は、CSSの「@media」規則と「@import」規則でも使用できます。メディア・クエリの解析規則は、CSSで用いられるメディア・クエリとの整合性を保つため、HTML4の規則とは互換性がありません。HTML5[HTML5](執筆時点ではまだ作成中)は、メディア・クエリの仕様を直接参照しており、したがって、HTMLの規則を更新しています。メディア・クエリメディア・クエリは、メディア・タイプと、特定のメディア特性の状況をチェックする0以上の式で構成されます。この項のメディア・クエリに関する記述は、構文の項に従っていることを前提としています。構文に従っていないメディア・クエリについては、エラー処理の項で記述します。この項の要件よりも構文が優先されます。HTMLで記述したシンプルな例です。/>この例は、あるスタイル・シート(example.css)が、ある特性を有するメディア・タイプ(「screen」)のデバイスに適用される(カラー画面でなければならない)ことを表します。同じメディア・クエリをCSSの@import規則で記述したものです。(color);メディア・クエリは、真か偽の論理式です。to」の行で定義されている)と一致し、そのメディア・クエリ内のすべての式が真である場合に真です。すべてのメディア・タイプに適用されるメディア・クエリには、省略構文が用意されており、「all」というキーワードは、(後続の「and」と一緒に)省略できます。メディア・タイプが明示されていない場合は「all」です。}次の2つも同じです。}複数のメディア・クエリを組み合わせて1つのメディア・クエリのリストにすることができます。これは、コンマ区切りのメディア・クエリのリストです。コンマ区切りのリスト内の1つ以上のメディア・クエリが真の場合、リスト全体が真となり、それ以外の場合は偽です。メディア・クエリ構文では、コンマは論理和を表し、「and」というキーワードは論理積を表します。CSSの@media規則を用いて、コンマ区切りのリストで複数のメディア・クエリを記述した例です。}メディア・クエリのリストが空(つまり、宣言が空の文字列または余白のみ)の場合、真となります。}論理否定は、notというキーワードで表現できます。メディア・クエリの先頭に「not」というキーワードがあれば、結果は否定されます。「not」というキーワードがないメディア・クエリが真であれば、偽になり、その逆も同じです。(HTML4の記述に従って)メディア・タイプのみをサポートしているユーザ・エージェントは、「not」というキーワードを認識せず、したがって、関連付けられたスタイル・シートは適用されません。/>「only」というキーワードを使用して、古いユーザ・エージェントからスタイル・シートを見えなくすることもできます。ユーザ・エージェントは、「only」で始まるメディア・クエリを、「only」というキーワードが存在していないかのように処理しなければなりません。/>メディア・クエリ構文は、HTML、XHTML、XML[XMLSTYLE]、CSSの@importおよび@media規則で使用できます。同じクエリをHTML、XHTML、XML、@import、@mediaで記述した例です。}[XMLSTYLE]仕様は、media疑似属性でメディア・クエリを用いるようにまだ更新されていません。メディア特性が、ユーザ・エージェントが動作しているデバイスに当てはまらない場合、そのメディア特性に関する式は偽となります。「device-aspect-ratio」というメディア特性は、視覚デバイスにのみ適用されます。したがって、音声デバイスでは、「device-aspect-ratio」が含まれる式は常に偽になります。/>単位がデバイスに当てはまらない場合、式は常に偽となります。「px」という単位は、「speech」デバイスには適用されず、したがって、次のメディア・クエリは常に偽です。/>「not」というキーワードがメディア・クエリの先頭に追加されれば、この例のメディア・クエリが真となることに注意してください。循環依存を回避するため、式を評価するためにスタイル・シートを適用する必要は全くありません。印刷したドキュメントの縦横比は、スタイル・シートの影響を受けるかもしれませんが、「device-aspect-ratio」に関する式は、ユーザ・エージェントのデフォルトの縦横比に基づくでしょう。必須ではありませんが、ユーザ・エージェントは、例えば、デバイスがランドスケープ(横長)モードからポートレート(縦長)モードに変更されるなどのユーザ環境の変化に応じてページを再評価し再レイアウトすることが期待されます。構文メディア・クエリ構文は、CSS2の文法で記述されます。そのため、ここで定義していない規則は、CSS2で定義されています。以下で定義しているmedia_query_list生成規則は、CSS2のmedia_list生成規則を置き換えるものです。;CSS2で定義されているCOMMENTトークンは、文法内には出現しませんが(可読性を確保するために)、これらのトークンは、他のトークンの間のどこにでも、何度でも出現できます。[CSS21]次の新しい定義が導入されます。\t\r\n\f])?|\\y次の新しいトークンが導入されます。RESOLUTION;}RESOLUTIONが、CSS2のterm生成規則に追加されます。CSSスタイル・シートは一般的に、大文字・小文字を区別せず、これはメディア・クエリでも同じです。構文への適合に加えて、個々のメディア・クエリが適合しているとみなされるためには、関連する仕様に従ってメディア・タイプとメディア特性を使用する必要があります。次の例では、「example」というメディア・タイプが存在しないため、最初のメディア・クエリのみが適合しています。適合しないメディア・クエリに対し、ユーザ・エージェントは、この項で記述している規則に従う必要があります。未知のメディア・タイプ。未知のメディア・タイプは、偽と評価します。事実上、デバイスのメディア・タイプと一致しない既知のメディア・タイプと同じように扱われます。unknownというメディア・クエリが実際にサポートされているメディア・タイプではない場合、「unknown」は、偽となります。unknown」は真となるでしょう。未知のメディア・タイプは、IDENT生成規則と実際に一致しないメディア・タイプとは異なります。これらは、不正なメディア・クエリ節に該当します。all」と表現します。all」と表わされ、偽となります。2番目のメディア・クエリは、事実上、最初のクエリが指定されなかったかのように評価されます。all」と表現されます。未知のメディア特性値。all」と表現します。all」と表現されます。all」と表現されます。}不正なメディア・クエリ。ユーザ・エージェントは、メディアの最後まで読んでメディアを解析している間に、()、[]、{}、""、''という対に対する規則に従ったり、エスケープを適切に処理したりしながら、遭遇した予期しないトークンを処理します。all」と表現されます。}下記は、andと式との間に空白がないことが認められていないため、不正なメディア・クエリです。(これは、関数表記の構文用に予約されています。}メディア・クエリは、ホスト言語のエラー処理規則にも従うことが期待されます。}セミコロンがCSSの@media規則を終了させるため、これは適用されません。構文的に、メディア特性はCSSプロパティーと似ています。これらには名前があり、特定の値が認められています。プロパティーとメディア特性にはいくつかの大きな違いがあります。プロパティーは、宣言の中で使用し、ドキュメントの表現方法に関する情報を提供します。メディア特性は、式の中で使用し、出力デバイスの要件を記述します。ほとんどのメディア特性では、「~以上」や「~以下」の制約を表現するために、オプションの「min-」や「max-」の接頭辞が認められています。この構文は、HTMLやXMLと衝突する可能性がある「<」や「>」の文字を避けるために用います。接頭辞が認められているこれらのメディア特性は、接頭辞と一緒に使用するのが最も一般的ですが、単独で使用することもできます。プロパティーは、宣言を形成するために常に値を必要とします。メディア特性は、値なしで使用することもできます。メディア特性のfeatureの場合、0または単位識別子付きの0ではない(つまり、0、0px、0emなどではない)値xに対して(feature:x)が真となる場合に、(feature)は真となります。min/maxの接頭辞が付いたメディア特性は、値なしでは使用できません。min/maxの接頭辞が付いたメディア特性を値なしに用いれば、メディア・クエリは不正になります。プロパティーでは、例えば、複数の値が含まれる計算式などの複雑な値が認められています。メディア特性では、1つのキーワード、1つの数、単位識別子付きの1つの数などの、1つの値しか認められていません。(唯一の例外は、「aspect-ratio」と「device-aspect-ratio」のメディア特性です。1))になったりする可能性があります。この仕様では、視覚および聴覚デバイスで使用可能なメディア特性を定義しています。同様に、メディア特性は、聴覚メディア・タイプに対しても定義できます。認める「width」メディア特性は、出力デバイスの対象表示領域の幅を記述します。連続メディアの場合、これは、表示されるスクロール・バー(もしあれば)のサイズを含むビューポート(CSS2の9.1.1項[CSS21]に記述されている)の幅です。ページ型メディアの場合、これは、ページ・ボックス(CSS2の13.2項[CSS21]に記述されている)の幅です。<length>には負の値を指定できません。次のメディア・クエリは、25cm以上の幅の印刷物でスタイル・シートを使用できることを表します。/>次のメディア・クエリは、ビューポート(画面/紙のドキュメントが表示される部分)が400~700ピクセルの幅のデバイスでスタイル・シートを使用できることを表します。}次のメディア・クエリは、ビューポートの幅が20em以上である場合に、画面および携帯デバイスでスタイル・シートを使用できることを表します。}「em」という値は、「font-size」の初期値と相対的です。認める「height」メディア特性は、出力デバイスの対象表示領域の高さを記述します。連続メディアの場合、これは、表示されるスクロール・バー(もしあれば)のサイズを含むビューポートの高さです。ページ型メディアの場合、これは、ページ・ボックスの高さです。<length>には負の値を指定できません。認める「device-width」メディア特性は、出力デバイスの描画面の幅を記述します。連続メディアの場合、これは、画面の幅です。ページ型メディアの場合、これは、ページ・シート・サイズの幅です。<length>には負の値を指定できません。}上記の例では、現在表示している幅がちょうど800ピクセルである画面にのみスタイル・シートが適用されます。単位の項で述べているように、「px」という単位は、論理的な単位です。認める「device-height」メディア特性は、出力デバイスの描画面の高さを記述します。連続メディアの場合、これは、画面の高さです。ページ型メディアの場合、これは、ページ・シート・サイズの高さです。<length>には負の値を指定できません。/>上記の例では、高さがちょうど600ピクセルの画面にのみスタイル・シートが適用されます。「px」という単位の定義が他のCSSと同じであることに注意してください。認めない「height」メディア特性の値が「width」メディア特性の値より大きい場合、「orientation」メディア特性は「portrait」です。ない場合は、「orientation」は「landscape」です。認める「aspect-ratio」メディア特性は、「height」メディア特性の値に対する「width」メディア特性の値の比率として定義されます。認める「device-aspect-ratio」メディア特性は、「device-height」メディア特性の値に対する「device-width」メディア特性の値の比率として定義されます。次のすべてメディア・クエリは、横が1280ピクセルで縦が720ピクセル(一般に「16:9」と呼ばれる)の画面デバイスと一致するでしょう。認める「color」メディア特性は、出力デバイスのカラー・コンポーネントあたりのビット数を記述します。デバイスがカラーではない場合、値は0です。<integer>には負の値を指定できません。次の2つのメディア・クエリは、すべてのカラー・デバイスにスタイル・シートが適用されることを表します。}次のメディア・クエリは、カラー・コンポーネントあたり2ビット以上のカラー・デバイスにスタイル・シートが適用されることを表します。}カラー・コンポーネントがそれぞれ異なるビット数で表わされている場合、最も小さい数が使用されます。8ビットのカラー・システムが、3ビットの赤のコンポーネント、3ビットの緑のコンポーネント、2ビットの青のコンポーネントを表わす場合、「color」メディア特性の値は2になります。インデックス・カラーを持つデバイスでは、参照テーブル内のカラー・コンポーネントあたりのビット数が最も小さいものが使用されます。ここで記述している機能は、表面的なレベルで色性能を記述できるだけです。これ以上の機能が必要である場合、今後サポートされる可能性があるより詳細なメディア特性がRFC2531[RFC2531]で提供されています。認める「color-index」メディア特性は、出力デバイスのカラー参照テーブルの項目数を記述します。デバイスがカラー参照テーブルを使用しない場合、値は0です。<integer>には負の値を指定できません。次の2つは、すべてのカラー・インデックス・デバイスにスタイル・シートが適用されることを表わす方法です。}このメディア・クエリは、256以上の色を持つカラー・インデックス・デバイスにスタイル・シートが適用されることを表します。認める「monochrome」メディア特性は、白黒のフレーム・バッファーにおけるピクセルあたりのビット数を記述します。デバイスが白黒でない場合、出力デバイスの値は0です。<integer>には負の値を指定できません。次の2つは、すべての白黒デバイスにスタイル・シートが適用されることを表現する方法です。}これは、ピクセルあたり2ビット以上の白黒デバイスにスタイル・シートが適用されることを表します。}これは、カラー・ページ用に1つのスタイル・シート、白黒用にもう1つのスタイル・シートがあることを表します。認める「resolution」メディア特性は、出力デバイスの解像度(つまり、ピクセル密度)を記述します。正方形ではないピクセル値を持つデバイスにクエリを実行する際には、指定された値を、「min-resolution」クエリでは最小密度と、また、「max-resolution」クエリでは最大密度と比べなければなりません。(「min-」や「max-」の接頭辞がない)「resolution」クエリは、正方形でないピクセル値を持つデバイスと適合しません。プリンタの場合は、これは、スクリーン解像度(任意の色の印刷ドットの解像度)に対応します。次のメディア・クエリは、300dpi以上の解像度を持つデバイスでスタイル・シートを使用できることを表します。}次のメディア・クエリは、118dpcm以上の解像度を持つデバイスでスタイル・シートを使用できることを表します。認めない「scan」メディア特性は、「tv」という出力デバイスの走査処理方法を記述します。次のメディア・クエリは、プログレッシブ・スキャン方式のtvデバイスでスタイル・シートを使用できることを表します。認めない「grid」メディア特性は、出力デバイスがグリッドであるかビットマップであるかのクエリを行うために用います。出力デバイスがグリッドに基づいている(例えば、「tty」端末や、1つの固定フォントのみを持つ電話のディスプレイなど)場合、値は1です。ない場合は、値は0です。0と1のみが有効な値です。)したがって、これら以外は、すべて不正なメディア・クエリとなります。値この仕様では、2つの新しい値も導入しています。<ratio>という値は、正の<integer>(0または負ではない)で、その後にオプションで空白が続き、その後に斜線(「/」)が続き、その後にオプションで空白が続き、その後に正の<integer>が続きます。<resolution>という値は、正の<number>で、直後に単位識別子(「dpi」または「dpcm」)が続きます。2.1で規範的に定義されています。単位メディア・クエリで使用する単位は、他のCSSと同じです。ピクセルの単位は、物理的なピクセルではなく、CSSピクセルを意味します。メディア・クエリの相対的な単位は、初期値に基づきます。これは、単位が宣言の結果に基づかないことを意味します。HTMLでは、「em」という単位は「font-size」の初期値と相対的です。「dpi」と「dpcm」という単位は、出力デバイスの解像度(つまり、デバイスのピクセル密度)を記述します。解像度の単位識別子は次のとおりです。dpiCSS「inch」あたりのドット数dpcmCSS「centimeter」あたりのドット数この仕様では、これらの単位は「resolution」メディア特性でのみ使用されます。謝辞この仕様は、W3Cのカスケーディング・スタイル・シートのワーキンググループによって作成されました。http://www.w3.org/TR/2010/REC-xml-stylesheet-20101028/。