需要更改滑块的宽度和高度，但图像会重叠

Question

我正在考虑更改此网站的首页滑块的宽度和高度：http://www.1000meninchrist.com/

我尝试使用以下代码更改宽度和高度：

<div class="iosSlider" style="position: relative; top: 0px; left: 0px; overflow: hidden; z-index: 1; width: 720px; height: 490px;"><!-- slider -->

我的问题是，当我试图改变滑块的宽度和高度时，图像会重叠。请告诉我我还需要做些什么改变。

Answer 1

稍微讨论一下代码之后，我相信你需要改变iosSlider类的宽度以及幻灯片类的宽度才能正确显示。

Answer 2

在CSS中 http://www.1000meninchrist.com/skin/frontend/default/beautyshop/css/slider.css

变化

.iosSlider {    
overflow: hidden;
width: 690px;
height: 490px;
margin:auto 0 0px;
float:left;
}

到

.iosSlider {
overflow: hidden;
width: 720px;
height: 490px;
margin:auto 0 0px;
float:left;
}

Answer 3

请将max-width应用于img元素：

.iosSlider img {
   max-width: 100%;
}