資料の一覧へ

タグの背景を指定

背景色の指定へ  壁紙の指定へ

背景色をつける

ブロック・インラインを問わず、どの要素でも背景色を指定できますが、ここではp（段落）に背景色をつける方法を紹介します。

<p>に背景色をつけた例

段落に指定された領域に色がつきます。
<body>に指定している背景色・壁紙は無視されます。

CSSとタグの記述例

<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>CSSでブロックを修飾</title>

<STYLE type="text/css">
<!--
p {
background-color: gold;
}
-->
</STYLE>

 　←CSSの指定開始
　←CSSが無効である場合に、指示を読み込ませないようにするための指定−開始
　←pタグへのCSS指定開始
　←背景色の指定
　←pタグへのCSS指定終了
　←CSSが無効である場合に、指示を読み込ませないようにするための指定−閉じ
　←CSSの指定終了
</head>

<body>

<p>段落に指定された領域に色がつきます。<br>
<body>に指定している背景色・壁紙は無視されます。</p>

</body>

壁紙を指定

ブロック・インラインを問わず、どの要素にも壁紙を指定できますが、ここではp（段落）に壁紙をつける方法を紹介します。

<p>に壁紙をつけた例

段落に指定された領域に壁紙が表示されます。
<body>に指定している背景色・壁紙は無視されます。

CSSとタグの記述例

<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>CSSでブロックを修飾</title>

<STYLE type="text/css">
<!--
p {
background-image: url(fish_3.gif)
}
-->
</STYLE>　

 　←CSSの指定開始
　←CSSが無効である場合に、指示を読み込ませないようにするための指定−開始
　←pタグへのCSS指定開始
　←壁紙の指定・(　)内に壁紙に指定する画像ファイル名を記述
　←pタグへのCSS指定終了
　←CSSが無効である場合に、指示を読み込ませないようにするための指定−閉じ
　←CSSの指定終了
</head>

<body>

<p>段落に指定された領域に色がつきます。<br>
<body>に指定している背景色・壁紙は無視されます。</p>

</body>