【CSS Modules】background-colorプロパティの使い方
background-colorプロパティの使い方について、初心者にもわかりやすく解説します。
作成日: 更新日:
基本的な使い方
background-colorプロパティは、HTML要素の背景色を保持するプロパティです。このプロパティを使用すると、ウェブページ上の<div>や<p>などの特定の要素、またはページ全体の<body>に視覚的な背景色を設定できます。これにより、要素を他の要素から明確に区別し、デザインに効果を与えます。
設定できる色の値は多岐にわたります。主なものとして、redなどの色キーワード、#RRGGBB形式の16進数カラーコード、rgb(R, G, B)形式のRGB値、そして透明度を含むrgba(R, G, B, A)形式があります。また、transparentを指定することで、背景を透明に設定することも可能です。
background-colorは要素のコンテンツ領域とパディング領域に適用されます。デフォルトではtransparent（透明）であり、親要素の背景が透けて見えますが、このプロパティで色を指定すると、その色が要素の背景として表示されます。このプロパティは継承されず、各要素で個別に背景色を指定します。ウェブデザインにおいて、要素の見た目を決定する上で非常に基本的な役割を果たすプロパティです。
公式リファレンス: background-color
構文(syntax)
1body { 2 background-color: #f0f8ff; 3}
引数(parameters)
引数なし
引数はありません
戻り値(return)
戻り値なし
戻り値はありません