javascript - 光滑的 JS 排水沟或轮播项目之间的空间

Question

如何在 slick.js 中的轮播项目之间放置间距或空格。下面是我的 js 和 html， slider 图像或项目之间没有空格。

 $('.responsive').slick({
     slidesToShow: 4,
     slidesToScroll: 4,
     responsive: [
     {
        breakpoint: 1024,
        settings: {
        slidesToShow: 3,
        slidesToScroll: 3,
     }
     },
    ]
    });


<div class="responsive">
  <div> <img src="slide1.jpeg"></div>
  <div> <img src="slide2.jpeg"></div>
  <div> <img src="slide3.jpeg"></div>
  <div> <img src="slide4.jpeg"></div>
  <div> <img src="slide5.jpeg"></div>
</div>

Answer 1

没有插件选项可以通过 Slick 本身来定义它。这是一个 CodePen Slick.js 轮播示例，您将看到轮播间距是通过 CSS 通过 margin 定义的。和padding属性(在本例中通过 <h3> 标签)。 http://codepen.io/saviaga/pen/qdENOx

CSS:

.responsive div img{ 
    margin: 10px;
}