style要素
style要素は、ドキュメントにスタイル情報を埋め込むことができます。
例)
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="">
<style>
h1{
color: red;
}
</style>
<title></title>
</head>
<body>
<div>
<h1>AAAaaaBBBbbbCCCccc</h1>
</div>
</body>
</html>
type属性
type属性には、スタイリングの言語を指定します。値はスタイリングの言語を示すMIMEタイプのtext/cssです。なお、属性が存在しない場合に使用されるtype属性のデフォルト値は、text/cssなので、CSSを指定する場合のtype属性は省略可です。
media属性
media属性は、スタイルが適用されたメディアを指定します。値は、有効なメディアクエリを指定します。
なお、media属性が省略された場合のデフォルト値は、デフォルトでリンクがすべてのメディアに適用されることを意味し、all です。
title属性
title属性は代替スタイルシートをセットします。値のテキストは、スタイルシートの切り替えに対応しているユーザー・エージェントのスタイルシートの切り替えタブなどに表示されます。
なお、祖先のtitle属性は、style要素には適用されませので、style要素にtitle属性の指定がない場合はタイトルがないことになり、ユーザー・エージェントのスタイルシートの切り替えタブなどに表示されません。
例)
<style title="標準"> h1{ color: red; } </style> <style title="代替1"> h1{ color: blue; } </style> <style title="代替2"> h1{ color: tomato; } </style>
上記のスタイルシートをセットしたHTMLファイルはこちら。 , Firefox 33.0.2での切り替えのキャプチャはこちら。
- カテゴリ
- メタデータ・コンテンツ。
- 要素を使用することができる場所
- メタデータ・コンテンツが使用できる場所。head要素の子であるnoscript要素の内容として。
- コンテンツ モデル(内容に含めることのできる要素)
- type属性に依存します。
- コンテンツ属性
- グローバル属性、type属性、media属性、title属性。