<style ①>~</style>
①:type=”MIMEタイプ” media=”対象メディア”
HTML文書にスタイルシートを組み込むにはいくつかの方法がありますが、該当のHTML文書全体に適用されるスタイルシートを1箇所にまとめて記述する場合は、style要素を使います。
■type属性
スタイルシート言語のMIMEタイプを指定します。デフォルトの値は「text/css」です。そのためWebページで一般的なCSSを利用する場合には、type属性を省略することができます。
■media属性
style要素の中に記述されたスタイルシートを、どのメディアに適用するのかを指定します。
例えは、PCの画面であれは「screen」、印刷時用であれは「print」のように指定します。
デフォルトの値は「all」です。media属性が省略されたときは、すべてのメディアに同じスタイルシートが適用されます。
■サンプル
<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”UTF-8”>
<title>スタイルシートを使う SAMPLE</title>
<style media=”screen”>
em{
color:#ffff00;
font-style:normal;
}
</style>
<style media=”print”>
em{
color:#00ffff;
font-style:normal;
}
</style>
</head>
<body>
<p>SAMPLE</p>
</body>
</html>
■要素解説
カテゴリー:メタデータ・コンテンツ。scoped属性が指定されている場合はフロー・コンテンツ
利用できる場所:scoped属性が指定されていない場合は、メタデータ・コンテンツが期待される場所、またはhead要素の子要素であるnoscript要素内。
scoped属性が指定されている場合は、フロー・コンテンツが期待される場所(ただし、style要素とホワイトスペース以外の他のフロー・コンテンツより前)。
コンテンツモデル:type属性の値による
■ブラウザ対応状況
IE10=○、IE9=○、Firefox=○、Chrome=○、Safari=○、Opera=○、iOS6=○、iOS5=○、Android=○