Items sildeを2行で表示するにはどうすればいいですか？

Question

私は16個の項目がスライドに沿って4で投稿した

<div class="owl-wrapper-outer"> 
<div class="owl-item"></div> 
<div class="owl-item"></div> 
<div class="owl-item"></div> 
<div class="owl-item"></div> 
<div class="owl-item"></div> 
<div class="owl-item"></div> 
... 
</div> 

私は4の二列でそれらを表示したいとの問題は、時間

Answer 1

$('.owl-carousel').owlCarousel({ 
 
    items:4, 
 
    lazyLoad:true, 
 
    loop:true, 
 
    margin:10, 
 
    autoplay:true, 
 
    autoplayTimeout:3000, 
 
    autoplayHoverPause:true, 
 
});

<link href="https://owlcarousel2.github.io/OwlCarousel2/assets/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://owlcarousel2.github.io/OwlCarousel2/assets/owlcarousel/owl.carousel.js"></script> 
 
<div class="owl-carousel owl-theme"> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=1" data-src-retina="https://placehold.it/350x250&text=1-retina" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=2" data-src-retina="https://placehold.it/350x250&text=2-retina" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=3" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=4" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=5" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=6" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=7" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=8" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=9" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=10" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=11" alt=""> 
 
</div> 
 
<br> 
 
<div class="owl-carousel owl-theme" > 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=1" data-src-retina="https://placehold.it/350x250&text=1-retina" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=2" data-src-retina="https://placehold.it/350x250&text=2-retina" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=3" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=4" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=5" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=6" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=7" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=8" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=9" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=10" alt=""> 
 
    <img class="owl-lazy" data-src="https://placehold.it/350x250&text=11" alt=""> 
 
</div>

で4によってスライドの変更