HTMLファイル内でスタイルを定義する

書式

<style>
スタイルの設定
</style>

説明

HTMLファイル内でスタイルを定義するにはstyle要素を使います。HTML5ではstyle要素のtype属性を省略することができます。省略時はtext/cssとして解釈されます。
設定するスタイルはstyle属性内で行います。HTMLファイル内にスタイルを定義してしまうのは、あまりよくありません。これは、ページのスタイルを変更する際、外部CSSファイルであれば、それだけを修正すれば済むのに対してHTMLファイル内に書いてしまうと、その部分も修正が必要になるためです。また、外部CSSファイルにしておけばファイルがブラウザによってキャッシュされるため2回目以降、ネットワークからの読み込みがなくなります。これによりページの表示を若干高速化することができます。

サンプル サンプルを実行 サンプルをダウンロード

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS3例文辞典サンプル</title>
<style>
h1 {
color : red;
}
</style>
<body>
<h1>CSS3 Sample</h1>
<p>見出し文字の色が赤色になります</p>
</body>
</html>
目次に戻る