Swiper Slider Responsive background Bild

Question

Ich benutze swiper für Bild Folie und jedes div hat ein Hintergrundbild, aber wie kann ich die Hintergrundbilder reagieren lassen?

Denn wenn ich die Größe des Fensters die Bilder wie Ernte sieht

Dank.

Dies ist das Thema We Bought: https://www.templatemonster.com/demo/61311.html#gref

Answer 1

Fügen Sie diese auf Ihre CSS-Datei.

@media only screen and (max-width: 991px){ 
    .swiper-slide { 
     background-size: contain !important; 
     background-repeat: no-repeat; 
     background-position: 0 50px !important; 
    } 
} 

dies wird das Hintergrundbild ansprechbar machen. Aber ich rate Ihnen, die Einstellungen so zu behalten, wie sie sind. Da wir die Höhe des Schiebereglers nicht bearbeiten können, gibt es eine weiße Lücke zwischen Bild und Beschriftung.

Answer 2

Vielleicht sollten Sie dies versuchen, und loszuwerden, Bildwiederholung oder weiß bg, verwenden Sie Hintergrundgröße: cover;

@media only screen and (max-width: 1170px){ 
.swiper-slide { 
    background-size: cover ! important; 
    background-repeat: no-repeat ! important; 
    background-position: 0 0 !important; 
    height: 480px ! important; 
} 
.swiper-container{ 
    height: 600px; 
} 
}