Слайдер Swiper: как уменьшить изображения, но при этом закрыть все окно? ⇐ CSS

[Anonymous]

Я использую Swiper, чтобы создать слайдер, который занимает все окно, за вычетом нескольких пикселей для панели – никаких проблем.

Однако, как вы можете видеть, изображение, которое я вставил для слайда, действительно увеличено (см. изображение ниже). ).

Как сделать так, чтобы на изображении было немного больше ширину, чтобы он не выглядел таким увеличенным/низкое качество?
Я пробовал возиться с некоторыми настройками ширины/высоты в стиле/CSS, но либо ничего не меняется, либо весь контейнер/ обертка запуталась.
CSS: (в заголовке html в теге стиля)
html, body {
position: relative;
height: 100%;
}
body {
background: #eee;
color:#000;
margin: 0;
padding: 0;
}
.swiper-container {
height: 100%;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
width: 100%;

}
.swiper-slide img{
min-width:100%;
}

Javascript:





var swiper = new Swiper('.swiper-container', {
spaceBetween: 0,
centeredSlides: true,
autoplay: {
delay: 8000,
disableOnInteraction: false,
},
loop:true,
pagination: {
el: '.swiper-pagination',
clickable: true,
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});



HTML:




("");">

("");">









Подробнее здесь: https://stackoverflow.com/questions/561 ... ole-window