Home > 実践 Web Standards Design p.113

実践 Web Standards Design p.113

  • Last Modified: 2008年11月30日 11:07

このページは、実践 Web Standards Design が第 1 刷・第 2 刷から第 3 刷となる際に、仕様自体の変更によって内容を修正した分について公開しています。

3.3/CSS管理のコツ

link要素、style要素のmedia属性
メディアグループ HTML 4.01 CSS2 CSS 2.1 説明
all すべてのデバイス
aural 音声出力(CSS 2.1では、CSS3 Speech Module※2のためにspeechメディアグループが予約され、auralメディアグループは非推奨とされている)
braille 点字ディスプレイ
embossed × 点字ページプリンタ(HTML 4.01では未定義)
handheld ポータブル機器(スクリーンが小さなデバイスや、周波帯域に制限があるものを指す)
print プリンタ
projection プロジェクタ
screen 一般的なコンピュータ画面
speech × × 音声出力(HTML 4.01およびCSS2でのauralに相当。Aural style sheets※3の項を参照のこと)
tty 固定ピッチ文字を使用するデバイス。ttyメディアグループにおいては、pxによる指定を行うべきではない
tv テレビ

たとえば、点字プリンタを表すembossedはHTML 4.01では定義されていませんし、音声出力を表すauralはCSS 2.1では非推奨と、いくつかの違いがあります。 ただし、CSS 2.1は現時点ではまだ勧告候補なので、音声出力を表す場合はaural,speechのように併用しましょう。 将来CSS 2.1あるいはCSS3が勧告となったときに、speechに改めることになることでしょう。

これらのメディアグループは、あるスタイルシートに対して一括して指定することもできますし、スタイルシート内で規則集合ごとに指定することもできます。 その使い分けを考えてみましょう。

まず、あるスタイルシート全体に対してメディアグループを指定する場合は(X)HTML側の指定で行います。 外部スタイルシートの指定の場合はlink要素のmedia属性、style要素による指定の場合はstyle要素のmedia属性で指定します。

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="fixed.css" type="text/css" media="screen, tv" charset="UTF-8" />
<!-- ↑視覚ブラウザ向けのCSSを読み込む-->

次ページに続く

Home > 実践 Web Standards Design p.113

Tag Cloud
Categories
Archives
Search
Feeds
  • Feed by feedburner.jp

Return to page top