background-colorの使い方

background-color

プロパティの説明

background-colorは、背景色を指定するプロパティです。全ての要素に指定することができます。ユーザがブラウザの文字色を変更している場合もあるので、通常はcolorプロパティを同時に指定します。

指定できる値

CSSで定義された色の値: #ff0000：赤、#00ff00：緑、#0000ff：青など。Webセーフカラー参照。
transparent: 標準設定。背景色を透明にします。

サンプル

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "https://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">

<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <meta http-equiv="Content-Style-Type" content="text/css">
 <title>サンプルページ</title>
 <style type="text/css">
 <!--
 body{color:#000000; background-color:#cccccc;}
 .b1{color:#000000; background-color:#ff0000;}
 .b2{color:#000000; background-color:#00ff00;}
 .b3{color:#000000; background-color:#0000ff;}
 -->
 </style>
</head>

<body>
 <h1>サンプルページ</h1>
 <p>全体の背景色に灰色を指定しています。</p>
 <p class="b1">背景色に赤を指定しています。</p>
 <p class="b2">背景色に緑を指定しています。</p>
 <p class="b3">背景色に青を指定しています。</p>
</body>

</html>