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>
実際の表示
A
B
C




