type属性

style要素のtype属性は、スタイリング言語のMIMEタイプを指定する任意属性。

ブラウザ対応

構文

<style type="MIMEタイプ">
	スタイル情報
</style>

MIMEタイプ

MIMEタイプは、多数存在するが、スタイルシート(CSS)のMIMEタイプは、text/cssなので、text/cssを指定する。

style要素におけるtype属性の初期設定値は、text/cssである。

要点

  • HTML5では、style要素におけるtype属性の初期設定値はtext/cssなので、style要素にtype属性を指定する必要性は特にない。
  • 以前のHTMLのstyle要素は、type属性が必須だった。

サンプルコード

<!DOCTYPE html>
<html lang="ja">
	<head>
		<meta charset="UTF-8">
		<style type="text/css">
			スタイル情報
		</style>
		<title>ドキュメントのタイトル</title>
	</head>
	<body>
		ドキュメントの内容
	</body>
</html>

サンプル

HTMLソースコード

<!DOCTYPE html>
<html lang="ja">
	<head>
		<meta charset="UTF-8">
		<style type="text/css">
			body {
				background-color: #ffea76;
				text-align: center;
			}
			article {
				padding: 1em;
				color: #f00;
				background-color: #e0ff95;
			}
		</style>
		<title>style要素のサンプル・ドキュメント</title>
	</head>
	<body>
		<h1>見出し[h1]</h1>
		<article>
			<h2>見出し[H2]</h2>
			<p>記事セクション。</p>
		</article> 
	</body>
</html>

実際の表示

別窓で表示