Задача состоит в том, как можно корректно добавить несколько фоновых картинок, а точнее 3 изображение для блока при помощи CSS3. Здесь оказывается не все так сложно, как может изначально показаться, ведь нужно задействовать универсальное свойство background, где в начале задаем первый фон, и делаем запятую, и автоматически после нее прописываем второй фон, и вот как получается.
Где для примера создадим вертикальных линий, что с левой стороны, так и и справа от самого блока.
HTML
Код
<div class="vonova-kartinka">
Valve представляет новую функцию в Steam, которая позволяет локальным многопользовательским играм транслироваться через Интернет.
</div>
CSS
Код
body {
background: #cecece; /* Цвет фона веб-страницы */
}
.vonova-kartinka {
background: url(https://zornet.ru/ABVUN/Aba/detunis/bg_left.png) repeat-y,
#f9f3f3 url(https://zornet.ru/ABVUN/Aba/detunis/bg_right.png) repeat-y 100% 0;
padding: 10px; /* Поля вокруг текста */
}
Так получилось при проверке:
Как можно заметить, что с картинками по сторонам прописаны цвета под фон, что самостоятельно под сайт настраиваются.
