처리중입니다. 잠시만 기다려주세요.
TTJ 코딩클래스
정규반 단과 자료실 테크 뉴스 코딩 퀴즈
퀴즈 / CSS / 문제

CSS object-fit 속성의 'cover' 값이 하는 역할은?

보통 MDN Web Docs
보기 및 정답
A 이미지의 가로세로 비율을 유지하면서 요소를 꽉 채우고, 넘치는 부분은 잘린다
B padding에 음수 값을 설정하면 요소의 내부 공간이 축소되는 효과가 있다
C margin: auto는 블록 요소뿐만 아니라 인라인 요소도 중앙 정렬한다
D margin collapse는 좌우 방향에서도 동일하게 발생하는 현상이다

해설

object-fit: cover는 이미지나 비디오의 가로세로 비율을 유지하면서 요소 영역을 완전히 채웁니다. 넘치는 부분은 잘려 보이지 않습니다. contain은 비율을 유지하되 전체가 보이게 하고, fill은 비율을 무시하고 늘립니다.

코딩, 제대로 배우고 싶다면?

개념 확인은 퀴즈로, 실력은 실전 프로젝트로.
투더제이 코딩클래스에서 시작하세요.

정규반 살펴보기