스 와이퍼 슬라이더 반응이 빠른 배경 이미지

Question

이미지 슬라이드에 swiper를 사용하고 있으며 각 div에 배경 이미지가 있지만 배경 이미지를 반응 적으로 만들 수 있습니까?

이미지를 자르면 이미지가 자르기처럼 보입니다.

고마워요. https://www.templatemonster.com/demo/61311.html#gref

Answer 1

은 CSS 파일이 추가 :

이것은 우리가 구입 한 주제이다.

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

이렇게하면 배경 이미지가 반응합니다. 그러나 설정을 그대로 유지하는 것이 좋습니다. 슬라이더의 높이를 편집 할 수 없으므로 이미지와 캡션 사이에 흰색 틈이 있습니다.

Answer 2

어쩌면 이것을 시도하고 반복되는 이미지 또는 흰색 bg를 제거하려면 background-size : 표지를 사용하십시오.

@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; 
} 
}