이미지 사이즈 맞추기 : obiect-fit 속성


이미지 사이즈 맞추기 : obiect-fit 속성

obiect-fit 속성은 width, height 비율은 유지하면서 내가 원하는 모양안에 <img>를 넣고 싶을때 사용 하면 좋다. background-image 를 꽉차게 만들때는 background-size: cover; 를 사용하면 된다. <img>에는 background-size: cover;를 사용 할 수 없기 때문에 그거와 동일한 obiect-fit: cover;를 사용하면 동일하게 표현이 된다. background-image를 사용하지 왜 <img>를 사용해? 라는 생각을 할 수있다. background-image 은 변화지 않는 이미지를 표현하고 싶을때 사용하지만, <img>은 이미지를 고정 할때도 사용하지만 나 같은 경우 프론트앤드 개발로 이미지가 어떤 상황에 따라 다른 이미지를 노출되어야 할때 사용한다. 그래서 obiect-fit 속성이 필요하다~~ 캐스케이딩 스타일 시트(Cascading Style Sheets, CSS) div{ width: 200px; hei...


#contain #비율조절 #width #obiect #none #img태그 #height #fill #cover #이미지

원문링크 : 이미지 사이즈 맞추기 : obiect-fit 속성