Как изменить размер изображения в div на обложку?

Question

Ок, я думаю, вы слышали это раньше ... Я попытался найти решение, но не могу его найти. У меня есть контейнер, который покрывает левые 50% экрана. Внутри контейнера я хочу, чтобы изображение покрывало пространство, а не растягивать. Css в данный момент:

height: auto; 
max-width: 100%; 

Пожалуйста, помогите !!!

Answer 1

добавить img в свой div и установить ширину и высоту изображения в 100%;

<div> <img src=""/> </div> 

CSS

img { 
width: 100%; 
height: 100%; 
} 

Answer 2

• Если у вас есть изображение больше, чем пространство, которое вы хотите, чтобы покрыть и вы используете IMG тег, чтобы сделать это, добавьте это в ваш CSS:

img {width: auto; height: auto;} 

• Если, вместо этого, вы используете DIV, чтобы поместить изображение в качестве фонового изображения, используйте:

div { 
    background-image: url("yourimage.png"); 
    background-repeat: no-repeat; 
    background-size: contain; 
} 

Answer 3

Вы можете использовать его в качестве фона и использовать следующие свойства:

background-repeat: no-repeat; 
background-position: center center; 
background-size: cover; 

https://jsfiddle.net/alexndreazevedo/upn7jwfs/