Question

我正在使用Nivo Slider的网站上工作：Website Demo

问题是，滑块部分在浏览器高度后不会达到100％的高度。我怎么能这样做？

我一直在检查并找到了这个css代码：

.nivoSlider {
  position:relative;
  width:100%;
  height:auto;
  overflow: hidden;
  left:0;
  margin-top:100px;
}

根据我的CSS知识，我们可以将height:auto;更改为height:100%以使滑块100％高度。唉，它不起作用！

我在这里缺少什么？

更新

我发现滑块的图像正在接管大小，这里写着：

.nivoSlider img {
  position: absolute;
  top: 0px;
  left: 0px;
  max-width: none;
  max-height: 100%; // I ADDED THIS TO MAKE 100% HEIGHT AND IT WORKS!!!
}

然而，现在图像正在被拉伸，我怎样才能切割图像而不是拉伸？

Answer 1

看下面的课程。您已指定900px身高。

.nivoSlider:after {
content: '';
background: transparent url(../../images/parallax_slider/pattern.png) repeat top left;
position: absolute;
height: 900px;
left: 0;
top: 0;
width: 100%;
z-index: 5;
}

如何让Nivo Slider 100％高度的浏览器？

1 个答案: