一つのDIV要素などに複数の背景を指定したい時ってありますよね?
例えば、四隅にそれぞれ違う画像を配置する場合などです。
CSSでは複数の背景画像の指定も可能です。
下記の場合は、3つの画像を指定しています。
1 2 3 4 5 6 7 8 9 |
.sample-box{ background-image: url(images/background1.jpg), url(images/background2.jpg), url(images/background3.jpg); background-position: center bottom, right top, left top; background-repeat: no-repeat, repeat, no-repeat; } |
background-imageで指定した画像の並び通りに、background-position等も指定することで、背景に関する指定も可能です。