我使用的是PHP&聪明的是，我正在尝试在提供的div中间显示幻灯片的图像，但无法完成。
下面是代码，有人能帮我解决我缺少的东西吗？
代码：
<div class="home_slide_show">
<!--start-image-slider---->
<div>
<ul class="rslides" id="slider_cars">
{section name=sec1 loop=$car_photos}
<li><img src="{$car_photos[sec1].photo}" alt=""></li>
{/section}
</ul>
</div>
<!--End-image-slider---->
</div>
CSS:
.home_slide_show{
background-color: white;
border: solid thick grey;
border-radius: 10px;
width:200px;
height:200px;
}
.home_slide_show img{
width:100%;
height:100%;
display: block;
}
完整HTML代码：
<div class="home_slide_show">
<!--start-image-slider---->
<div>
<ul class="rslides rslides2" id="slider_cars">
<li style="vertical-align: middle; display: block; float: none; position: absolute; opacity: 0; z-index: 1; transition: opacity 600ms ease-in-out;" id="rslides2_s0" class=""><img src="images/cars/download.jpg" alt=""></li>
<li style="vertical-align: middle; float: none; position: absolute; opacity: 0; z-index: 1; display: list-item; transition: opacity 600ms ease-in-out;" id="rslides2_s1" class=""><img src="images/cars/images (1).jpg" alt=""></li>
<li style="vertical-align: middle; float: left; position: relative; opacity: 1; z-index: 2; display: list-item; transition: opacity 600ms ease-in-out;" id="rslides2_s2" class="rslides2_on"><img src="images/cars/images (2).jpg" alt=""></li>
<li style="vertical-align: middle; float: none; position: absolute; opacity: 0; z-index: 1; display: list-item; transition: opacity 600ms ease-in-out;" id="rslides2_s3" class=""><img src="images/cars/images (7).jpg" alt=""></li>
<li style="vertical-align: middle; float: none; position: absolute; opacity: 0; z-index: 1; display: list-item; transition: opacity 600ms ease-in-out;" id="rslides2_s4" class=""><img src="images/cars/images.jpg" alt=""></li>
</ul>
</div>
<!--End-image-slider---->
</div>
用户代理为ul元素添加默认边距和填充。将两者都设置为零。
如果你想让它们居中，可以试试这个：
.img{
width:100%;
height:100%;
display: block;
margin: 0 auto;
}
也可以看看这篇文章：https://css-tricks.com/snippets/css/absolute-center-vertical-horizontal-an-image/