Как правильно указать размеры картинки в swiper slider?

Question

[cracker-test]

Когда я указываю высоту и ширину картинки 100%, то картинка пропадает, но когда задаю ширину жестко в пикселях, то она появляется. Скажите, как сделать, чтобы картинка подстраивалась под размеры блока?

<div class="swiper-slide">
										<div class="slider">
											<div class="link">

												<div class="slider-img" style="background-image: url('./img/test.jpg');  width: 500px!important;  height: 420px;"></div>
												
											</div>
										</div>
									</div>

Comments

[Ankhena]

Размер фоновой картинки регулируется свойством background-size.

Когда я указываю высоту и ширину картинки 100%

Вы задаете размера блока, а не картинки.
Если проценты считать не от чего, то блок становится нулевого размера. Ширина у него, скорее всего, остается по ширине блока слайдера. а высота становится нулевой.

Соответственно, вам нужно определиться, что от чего зависит. Блок от картинки, картинка от блока или они вместе от размеров слайдера или от каких-то пропорций и т.д. В общем, самая простая геометрия.
А потом всё это записать в CSS.

[cracker-test]

Ankhena, что мне нужно указать чтобы картинка подстраивалась под блок?

[Ankhena]

cracker-test, нужно открыть справочник https://developer.mozilla.org/ru/docs/Web/CSS/back... и выбрать подходящее значение. Я не знаю, какое вам нужно, потому что вы не рассказали как именно она должна подстраиваться.

[cracker-test]

Ankhena, спасибо