html:

<div class="swiper-container" id="topSwiper">

    <div class="swiper-wrapper">

        {% for wheel in wheels %}

            <div class="swiper-slide">

                <img src="{{ wheel.img }}" alt="{{ wheel.name }}">

            </div>

        {% endfor %}

    </div>

    <!-- Add Pagination -->

    <div class="swiper-pagination"></div>

</div>

css:

头部轮播图部分

#topSwiper {

    height: 8rem;

    width: 100%;

    overflow: hidden;

}

#topSwiper .swiper-wrapper{

    width: 100%;

    height: 100%;

}

#topSwiper .swiper-wrapper a{

    display: inline-block;

    width: 100%;

    height: 100%;

}

#topSwiper img{

    width: 100%;

    height: 100%;

}

#topSwiper .swiper-pagination{

    bottom: 0px;

}