Javascript 滑滑块两排，如何？

我如何使它有两行文字如下？ 这就是我想要的： 我想做到这一点

这是我的HTML

               <div class="radio-news-slider">
                    <article>
                        <figure>
                            <a href="#">
                                <img src="img/radio-new/radio-new.png" alt=""/>
                            </a>
                        </figure>
                        <a href="#">Lorem ipsum dolor sit amet</a>
                        <p class="mb-0">
                            Class aptent taciti sociosqu ad litora torquent per conubia
                        </p>
                    </article>
                    <article>
                        <figure>
                            <a href="#">
                                <img src="img/radio-new/radio-new.png" alt=""/>
                            </a>
                        </figure>
                        <a href="#">Lorem ipsum dolor sit amet</a>
                        <p class="mb-0">
                            Class aptent taciti sociosqu ad litora torquent per conubia
                        </p>
                    </article>
                 </div>

每个科努比亚的社会责任等级


每个科努比亚的社会责任等级

还有更多的阿提克莱斯。 这是此代码的输出：

这是我的JS：

$('.radio-news-slider').slick({
    infinite: true,
    slidesToShow: 5,
    prevArrow: "<i class='slick-prev pull-left fas fa-sort-up' aria-hidden='true'></i>",
    nextArrow: "<i class=' slick-next pull-right fas fa-sort-up' aria-hidden='true'></i>",
    responsive: [
        {
            breakpoint: 576,
            settings: {
                slidesToShow: 3,
                rows: 2
            }
        },
        {
            breakpoint: 768,
            settings: {
                slidesToShow: 3
            }
        },
        {
            breakpoint: 992,
            settings: {
                slidesToShow: 4
            }
        }
    ]
});

$（'.radio news slider'）.slick({
无限：是的，
幻灯片放映：5，
前箭头：“，
下一行：“，
响应：[
{
断点：576，
设置：{
幻灯片放映：3，
行数：2
}
},
{
断点：768，
设置：{
幻灯片放映：3
}
},
{
断点：992，
设置：{
幻灯片放映：4
}
}
]
});

---

请帮助我如何执行此操作。

您可以使用

slidesPerRow

和

rows

检查以下代码

$（'.carousel'）。光滑({
点：是的，
/*行：2，
幻灯片错误：3*/
前箭头：“，
下一行：“，
响应：[
{
断点：576，
设置：{
幻灯片错误：1，
行数：1
}
},
{
断点：768，
设置：{
幻灯片错误：2，
行数：1
}
},
{
断点：992，
设置：{
幻灯片错误：3，
行数：2
}
}
]
});
。光滑的幻灯片{
img{
宽度：100%；
}
}
.slick-list.draggable{
边际：0.50px；
}
.carousel.slick-initialized.slick-slider.slick-dotterd{
位置：相对位置；
}
i、 slick-prev.pull-left.fas.fa-arrow-left.slick-arrow{
位置：绝对位置；
左：0；
最高：42%；
光标：指针；
}
i、 slick-next.pull-right.fas.fa-arrow-right.slick-arrow{
位置：绝对位置；
右：0；
最高：42%；
光标：指针；
}
圆点{
文本对齐：居中；
}
ul.slick-dots李{
显示：内联块；
利润率：0.10px；
}
992px需要两行，然后是一行，怎么做？