-1

我想定位我的响应式幻灯片并调整图像大小，使其适合我的网站。这是当前的 CSS 文件：

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 90%;
  margin: 0px;
  padding: 0;
  border: 0;
  margin-left: 10%;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: relative;
  width: 100%;
  height: 100%;
  margin-bottom: 0px;
  margin: 0px;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 90%;
  border: 0;
  margin: 0;
  margin-bottom: 0px;
  margin-left: 10%;
  }

但这给了我以下结果： 白色边框

有没有办法让图像变大，让白色边框消失？谢谢。

4

2 回答 2

2

我在自己的项目中使用了响应式滑块bxSlider ，您可以自定义滑块的默认 CSS。

于 2015-10-06T18:33:57.683 回答
0

在您的.rslides img班级中，您拥有width:90%并将margin-left:10%这些更改为width:100%and margin-left:0（或margin-left完全删除，因为您已经拥有margin:0px）应该摆脱白色边框，并且您的图像应该拉伸以填充内容

我认为您可能会犯此错误的原因是您将其放入其中要么是意外，要么是由于混淆了 div 故障的工作原理。在您的情况下，rslides该类已经将内容移动margin-left:10%并包含该内容，方法是在您有效地使用 90% 的 div 的 90% 并将边距移动 90% 宽度的 10% 时width:90%再次执行它rslides img

于 2015-10-06T18:46:20.937 回答