style 属性は、HTML 要素のスタイルを変更するために使用されます。

This text is in Verdana and red

This text is in Times and blue

This text is 30 pixels high

試してみる

HTML スタイル属性

スタイル属性の役割:

すべての HTML 要素のスタイルを変更するための一般的な方法を提供します。

スタイルは、HTML 要素のスタイルを変更する新しい推奨方法として、HTML 4 で導入されました。 HTML スタイルでは、style 属性を使用してスタイルを HTML 要素に直接追加するか、別のスタイル シート (CSS ファイル) で間接的に定義することができます。

HTML チュートリアルでは、style 属性を使用した HTML スタイルについて説明します。

非推奨のタグと属性

HTML 4 では、いくつかのタグと属性が非推奨になっています。 非推奨とは、これらのタグと属性が HTML と XHTML の将来のバージョンでサポートされないことを意味します。

ここでのメッセージは明確です: これらの非推奨のタグと属性は避けてください!

次のタグと属性は避ける必要があります:

ラベル 説明
<センター> は、中央に配置するコンテンツを定義します。
<フォント>と<ベースフォント> は HTML フォントを定義します。
<s> と <strike> 取り消し線テキストの定義
<u> 下線付きテキストの定義
属性 説明
整列 テキストの配置を定義する
背景色 背景色を定義する
テキストの色を定義

これらのタグと属性について: 代わりにスタイルを使用してください!

HTML スタイルの例 - 背景色

background-color 属性は、要素の背景色を定義します:

<html>

<body style="background-color:yellow">
<h2 style="background-color:red">This is a heading</h2>
<p style="background-color:green">This is a paragraph.</p>
</body>

</html>

試してみる

style 属性は、「古い」bgcolor 属性を廃止します。

HTML スタイルの例 - フォント、色、サイズ

font-family、color、および font-size 属性は、要素内のテキストのフォント ファミリー、色、およびフォント サイズをそれぞれ定義します。

<html>

<body>
<h1 style="font-family:verdana">A heading</h1>
<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>
</body>

</html>

試してみる

style 属性は、古い <font> タグを廃止します。

HTML スタイルの例 - テキストの配置

text-align 属性は、要素内のテキストの水平方向の配置を指定します:

<html>

<body>
<h1 style="text-align:center">This is a heading</h1>
<p>The heading above is aligned to the center of this page.</p>
</body>

</html>

試してみる

style 属性は、古い「align」属性を廃止します。