メディアタイプの指定をする事で、どのデバイスを対象にスタイルを適用させるかを制御する事ができます。
たとえば、モニタ上に表示される場合と、プリンタで出力する場合では必要とする情報やレイアウトが変わってくる場合もあります。
このような場合に、メディアタイプの指定をするとプリント専用のCSSを作成したりすることが可能になります。

CSS2.1で指定されているメディアタイプ

all

全てのデバイスを対象とする

braille

点字の触角をフィードバックするデバイス

embossed

点字プリンタなどの点字出力デバイス

handheld

片手で持てる程度のサイズをしたPC

print

印刷用出力、印刷プレビューも含む

projection

プロジェクターなど投影表示を意図したデバイス

screen

PCのディスプレイ

speech

音声合成機器

tty

テレタイプ、ケータイなど、固定ピッチフォントで出力されるデバイス

tv

テレビ

これらのメディアタイプを指定する方法はいくつかありますが、ここではlink要素のmedia属性を使った方法と、@mediaルールを使った方法を説明します。
ちなみに、CSSの各プロパティは、それぞれ属するメディアタイプが定義されていて、そのメディアタイプ以外では適用されないようになっています。

link要素のmedia属性を使った方法

link要素を使う場合は、CSSファイルをhead要素の範囲内で、link要素によって読み込むときに、media属性にメディアタイプの指定をします。
このメディアタイプは、カンマ（,）区切りで複数指定する事も可能です。

<link href="/css/style.css" rel="stylesheet" type="text/css" media="screen, projection" />

@mediaルールを使った方法

@mediaルールを使う場合は、適用させたいメディアタイプの規則集合全てを囲うように書きます。link要素の方法と同じくカンマ（,）区切りで複数指定する事も可能です。

@media print, handheld {
  #sub {
    display: none;
  }

  html,
  body {
    background: #fff;
  }
}