更改owl-carousel中图像的宽度

Question

我正在尝试改变我的owl-carousel中图像的宽度。

            <!-- Slider -->
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="owl-carousel owl-carousel-fullwidth">
                        <div class="item"><img src="images/frontview.jpg" alt="image"></div>
                        <div class="item"><img src="images/entry.jpg" alt="image"></div>
                        <div class="item"><img src="images/register.jpg" alt="image"></div>
                        <div class="item"><img src="images/bulk2.jpg" alt="image"></div>
                        <div class="item"><img src="images/herbs3.jpg" alt="image"></div>
                        <div class="item"><img src="images/overhead.jpg" alt="image"></div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Slider -->

如果我在图像上单击鼠标右键来检查元素，它会显示这种内联样式：

<div class="owl-item" style="width: 960px; margin-right: 0px;">

在文档中我能找到的关于宽度的唯一信息是关于autoWidth的，这对我没有帮助。

有什么想法吗？谢谢!

var owlCarouselFeatureSlide = function() {
    $('.owl-carousel').owlCarousel({
        animateOut: 'fadeOut',
        autoplay: true,
        autoplayTimeout: 5000,
        autoHeight: true,
        items: 1,
        margin: 0,
        responsiveClass: true,
        nav: true,
        dots: true,
        // smartSpeed: 500,
        navText : ["<i class='icon icon-chevron-left'></i>","<i class='icon icon-chevron-right'></i>"]
    });
};

Answer 1

Owl Carousel在浏览器窗口调整大小时动态设置div.item的宽度，但不设置每个div.item中的元素。因此，您可以提供CSS来实现这一点。由于您已经在使用Bootstrap，请看一下它提供的这些https://getbootstrap.com/docs/4.0/content/images/类