响应幻灯片-我可以't处理css

ResponsiveSlides - I can't handle css

本文关键字:处理 css 幻灯片 我可以 响应      更新时间:2023-09-26

我想使用responsiveslides.js。它可以工作,但我不知道如何更改css以获得100%宽度的滑块和无边距。有人能帮我吗?以下是责任清单。ss

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }
.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }
.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

在身体里我有:

<div id="sliderdiv">
                <ul class="rslides" id="slider1">
                <li><img src="../css/images/one.jpg" alt=""/></li>
                <li><img src="../css/images/two.jpg" alt=""/></li>
                <li><img src="../css/images/three.jpg" alt=""/></li>
                </ul>
            </div>

带有

#sliderdiv{ width: 100%; height: 300px; padding: 0px; }

现在看起来是这样的:

http://oi61.tinypic.com/2hgwac4.jpg

试试这个,它可能会工作

.rslides img {
display: block;
height: auto;
float: left;
width: 100%;
border: 0;
}

因为高度将是自动的,例如:250px;并且将保持不变。

您可能在选项中设置了最大宽度。

$(".rslides").responsiveSlides({  
    maxwidth: "", <- LOOK FOR THIS
});

如果是这样的话,删除该行应该可以解决这个问题。