style要素

概要

style要素はスタイルシートを記述するための要素です。

要素の内容

style要素の内容はスタイルシートです。HTMLではCDATA、XHTMLでは#PCDATAと定義されています。

属性

固有属性

属性名 属性値 説明
type ContentType 必須属性。スタイルシート言語をMIMEタイプで指定します。例えばCSSならば"text/css"です。必ず指定する必要があります。
media MediaDesc スタイルシートを適用する出力メディアを指定できます。
xml:space preserve XHTMLのみ。XMLの予約属性です。値は"preserve"で固定されています。

汎用属性

id(XHTML1.0のみ), title, langxml:lang), dir, xmlns(XHTML1.1のみ)

説明

style要素はスタイルシートを記述するための要素です。head要素内に配置し、要素の内容としてスタイルシートを記述します。

<style type="text/css">
  /* ここにスタイルシートを記述 */
</style>

古いブラウザへの対処

style要素に対応したブラウザであれば、style要素の内容を表示することはありません。しかし、style要素を知らない古いブラウザではstyle要素の内容が表示されてしまう可能性があります。そこでHTMLではstyle要素の内容をコメントアウトします。

<style type="text/css">
<!--
  /* ここにスタイルシートを記述 */
-->
</style>

ただし、XHTMLではこの方法を用いることはできません。XHTMLではstyle要素の内容がCDATAから#PCDATAに変更されました。そのため、<!---->で囲むとコメントとしてブラウザに無視される可能性があります(コメントとして無視するのが正しい挙動です)。

この問題は外部スタイルシートを用いることで解決します。別のファイル(例えばstyle.css)にスタイルシートを記述し(外部スタイルシート)、このようなlink要素で関連付けます。

<link rel="stylesheet" href="style.css" type="text/css" />

関連要素