我使用的是帶有4個圖像的引導轉盤滑塊，最后2個圖像非常合適，前2個不合適，它們在頂部被切掉，前2個圖像是4000 x 3000，后2個是4000 x 2000。有辦法縮小背景圖像嗎？我正在使用背景尺寸:封面和我的前兩個圖像被剪掉了，有人對我該怎么做有什么建議嗎？

.fill { width: 100%;  height: 100%; background-position: center; background-size: cover; }


<header id="myCarousel" class="carousel slide">
                <!-- Indicators -->
                <ol class="carousel-indicators">
                    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                    <li data-target="#myCarousel" data-slide-to="1"></li>
                    <li data-target="#myCarousel" data-slide-to="2"></li>
                    <li data-target="#myCarousel" data-slide-to="3"></li>
                </ol>

                <!-- Wrapper for Slides -->
                <div class="carousel-inner">
                    <div class="item active">
                        <!-- Set the first background image using inline CSS below. -->
                        <div class="fill" style="background-image:url('/Images/banner-images/slider-1.jpg?v=4789372489');"></div>
                    </div>
                    <div class="item">
                        <!-- Set the second background image using inline CSS below. -->
                        <div class="fill" style="background-image:url('/Images/banner-images/slider-2.jpg?v=4789372489');"></div>
                    </div>
                    <div class="item">
                        <!-- Set the third background image using inline CSS below. -->
                        <div class="fill" style="background-image:url('/Images/banner-images/slider-3.jpg?v=4789372489');"></div>
                    </div>
                    <div class="item">
                        <!-- Set the third background image using inline CSS below. -->
                        <div class="fill" style="background-image:url('/Images/banner-images/slider-4.jpg?v=4789372489');"></div>
                    </div>
                </div>

                <!-- Controls -->
                <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                    <span class="icon-prev"></span>
                </a>
                <a class="right carousel-control" href="#myCarousel" data-slide="next">
                    <span class="icon-next"></span>
                </a>

            </header>



.carousel {
    height: 600px;
}

@media (min-width: 768px) {

    .carousel {
        height: 75vh;
    }
}

試試長寬比。可能對比例有幫助。