style属性

style属性は、スタイルシート(CSS)を要素に直接指定するグローバル属性

ブラウザ対応

構文

<element style="スタイルシート">
スタイルシート
スタイルシートのコードを指定。

要点

  • スタイルシート(CSS)を、要素に直接指定する。
  • style要素で括ったスタイルシートや、外部スタイルシートファイルで指定したスタイルシートを、style属性に指定したスタイルシートで上書きする。style属性に指定したスタイルシートが、優先される。
  • 全てのHTML要素で使用できるグローバル属性である。

サンプルコード

1つのスタイルを指定

<p style="color: darkred;">テキスト</p>

複数のスタイルを指定

<p style="text-indent: 1em; color: darkred; background-color: lightgreen;">テキスト</p>

サンプル

HTMLソースコード

<style scoped="scoped">
	span {
		padding: 0 0.5em;
		font-size: 32px;
		color: darkgreen;
	}
</style>
<span style="background-color: pink;">A</span>
<span style="font-size: 64px; color: darkred; background-color: lightblue;">B</span>
<span style="font-size: 128px; color: darkblue; background-color: lightgreen;">C</span>

実際の表示