このbackground-position属性は背景画像を表示する位置を指定できる属性です、背景画像をホームページの中央寄せにしたいなどの場合に使います。
セレクタ{
background-image:url(gazou.gif);
background-attachment:fixed;
background-repeat:no-repeat;
background-position:70% 60%;
}
画像は<body>タグで宣言されています、背景画像を左端から７０％、上から６０％の部分に持ってきました。
| 値 | 概要 |
|---|---|
| % | 左からの位置と上からの位置を％で指定 |
| px | 左からの位置と上からの位置をピクセルで指定 |
| center | 背景画像を中央に置く |
| top | 背景画像を上に置く |
| right | 背景画像を右に置く |
| bottom | 背景画像を下に置く |
| left | 背景画像を左に置く |
背景画像を繰り返さないで置きたい場所に置くことができるのが魅力です。使い方次第でホームページの見栄えも上がるでしょう。