背景に関するCSS
■背景色
■例BODY
{background-color:yellow}
■例DIV
{background-color:blue}
■例FONT
{background-color:red}
■CSS
タグ{background-color:色}
■HTML
<タグ style="background-color:色">〜</タグ>
■背景画像
■例BODY
{background-image:
url(画像URL)}
■例DIV
{background-image:
url(画像URL)}
■例FONT
{background-image:
url(画像URL)}
■CSS
タグ{background-image:url(画像URL)}
■HTML
<タグ style="background-image:url(画像URL)">
〜</タグ>
■背景画像の繰り返し
■例BODY
{background-repeat:
no-repeat}
■例DIV
{background-repeat:
repeat-y}
■例FONT
{background-repeat:
repeat-x}
■CSS
タグ{background-repeat:キーワード}
■HTML
<タグ style="background-repeat:キーワード">
〜</タグ>
■キーワード
キーワード
| 繰り返し方
| |
repeat
| 全て繰り返す(通常)
| |
repeat-x
| 横方向にのみ繰り返す
| |
repeat-y
| 縦方向にのみ繰り返す
| |
no-repeat
| 繰り返さない
| |
■背景画像を固定する
■CSS
タグ{background-attachment:キーワード}
■HTML
<タグ style="background-attachment:キーワード">
〜</タグ>
■キーワード
キーワード
| 固定するかどうか
| |
scroll
| 固定しない(通常)
| |
fixed
| 固定する
| |
■背景画像の表示位置
■CSS
タグ{background-position:キーワード}
■HTML
<タグ style="background-position:キーワード">
〜</タグ>
■キーワード
キーワード
| 表示位置
| |
top
| 上
| |
bottom
| 下
| |
center
| 中
| |
right
| 右
| |
left
| 左
| |
サイズで指定
領域の左上からの距離を
サイズで指定する事も出来ます
| |
■関連項目
■背景の色、画像、配置方法をまとめて指定する
■CSS
タグ{background:
色 url(画像URL) 繰り返し 固定 表示位置}
■HTML
<タグ style="background:
色 url(画像URL) 繰り返し 固定 表示位置">〜</タグ>
Presented by
HTML辞典