如何將物品放在Slick Carousel中？

Question

我正在使用Slick Carousel ，但有一個布局癢，我無法划傷。 當我的物品數量少於旋轉木馬可以同時顯示的物品時，它們是左對齊的。 我希望他們能夠集中精力。 例如，如果slidesToShow等於3，只有2個項目，我得到

-------------------
 IIIII IIIII
-------------------

當我想要的是

-------------------
    IIIII IIIII
-------------------

或者如果只有1個項目：

-------------------
       IIIII
-------------------

我試過設置centerMode ，但這是一個完全不同的效果。

有沒有辦法得到我想要的效果？ 它需要處理slidesToShow被響應斷點減少。

Answer 1

快速檢查輪播的DOM顯示，這些項目放在具有類型slick-track的元素中。 可以通過修改該元素的邊距來居中項目：

.slick-track {
    margin:auto;
}

演示這個JSFiddle 。

請注意，在最后一項處於活動狀態時，演示中的輪播有時會在調整大小時停止正常工作，但無論此CSS修改如何都會發生這種情況。

Answer 2

margin:0 auto; 在<img>標簽上為我工作。

例如，

<div class="items">
    <div>
        <img src="https://via.placeholder.com/25x50" />
    </div>
    <div>
        <img src="https://via.placeholder.com/25x50" />
    </div>
    <div>
        <img src="https://via.placeholder.com/25x50" />
    </div>
<div>

CSS

.items { background:red; }
.items img { margin:0 auto; }

https://jsfiddle.net/cegor9j2/