最近勉強のために、色々なWEBサイトのコードを見ている。
その中で、<head>タグ内に
1 | link rel="stylesheet" media="screen" href="~" |
というコードをよく見るけど、このmedia="screen"は
「一体どういうもの?」
と思ったので簡単に調べてみた。
media="screen"とは?
どうやらこれは、link要素で使うmedia属性というものらしい。
CSSをメディア(PCとかテレビとかの機器)によって切り替えるために必要らしい。
ちなみにmedia="screen"っていうのは、
「一般的なコンピューター用カラーディスプレイでページが読まれる時にこのCSSを使え」
という意味だそうだ。
media="~" で使われる種類としては
- all :すべての機器(これがデフォルト)
- screen :一般的なコンピュータ用カラーディスプレイ(普通のPC)
- tv: テレビ
- handheld :携帯電話など
- print: プリンタ
- projection :プロジェクタ
などがある。
要は難しいことを考えずに、<link rel="stylesheet media="screen" href="~">というコードがあれば、
「あっこれはPC用のCSSを読み込むのね。」
と思っておけばいい。