Несколько фоновых изображений на CSS
CSS3 позволяет делать такие вещи, это будет выглядеть следующим образом:
body {
background-image: url(images/bgtop.png), url(images/bg.jpg);
background-repeat: repeat-x, repeat;
}
Ниже пример который отображает подобный код. Обратите внимание, что на первое место выдвигается та картинка, которая указана первой.
Пример
Современные версии всех браузеров нормально воспримут такой код, однако если Вам необходима поддержка IE8 и ниже, тогда лучший способ добиться такого эффекта — добавить дополнительные div-ы:
<body> <div id="bgtopdiv"> Здесь контент </div> </body>
body{
background-image: url(images/bg.png);
}
#bgtopdiv{
background-image: url(images/bgtop.png);
background-repeat: repeat-x;
}
Пример