[CSS]object-fit 속성에 대하여

object-fit: fill;

 

대체되는 요소의 내용이 지정된 너비와 높이에 따라서 이미지가 확대 또는 축소되어 

요소를 가득채울 수 있는 크기로 변화되어서 적용된다. 

가로세로 비율이 유지되지 않는다.

 

object-fit: contain;

 

내용이 가로세로 비율을 유지하면서 요소의 크기에 맞게 확대 또는 축소된다. 

공백이 생길 수 있다.

 

object-fit: cover;

 

내용이 가로세로 비율을 유지하면서 요소의 크기에 맞게 확대 또는 축소된다.

공백이 생기지 않고 가능 채워진다.

 

object-fit: scale-down; 과 object-fit: none; 은 알아보지 않겠다.