Queria colocar mais de uma imagem neste slider. Atualmente, consigo colocar apenas uma. Como faço para colocar mais de uma imagem?
Código HTML
<div class="banner">
<div class="container">
<div id="top" class="callbacks_container">
<ul class="rslides" id="slider">
<li>
<div class="banner-text">
<h3>Camisa Doutor Estranho </h3>
<p>R$50,00 a vista</p>
<p>ou em 5x de R$10,00 sem juros</p>
<a href="single.html">Comprar</a>
</div>
</li>
<li>
<div class="banner-text">
<h3>There are many variations </h3>
<p>Contrary to popular belief, Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor .</p>
<a href="single.html">Learn More</a>
</div>
</li>
<li>
<div class="banner-text">
<h3>Sed ut perspiciatis unde omnis</h3>
<p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor .</p>
<a href="single.html">Learn More</a>
</div>
</li>
</ul>
</div>
</div>
</div>
Código CSS
.banner{
background: url(../images/1.jpg) no-repeat;
background-size: cover;
width:100%;
min-height: 460px;
position: relative;
}
background: url(../images/1.jpg) no-repeat;
, e coloca-lo dentro da propriedade style="" na tag <li><li style="background: url(../images/1.jpg);">