처리중입니다. 잠시만 기다려주세요.
TTJ 코딩클래스
정규반 단과 자료실 테크 뉴스 코딩 퀴즈
더보기
인사이트 FAQ 유튜브 카페

로그인

| 비밀번호찾기

추가 정보 입력

서비스 이용을 위해 휴대전화 번호를 입력해주세요.

회원가입

무료 회원가입 가입비 없이 무료로 가입할 수 있습니다

이미 계정이 있으신가요?

비밀번호 찾기

퀴즈 / CSS / 문제

CSS aspect-ratio 속성의 역할은?

보통 MDN Web Docs
보기 및 정답
A 요소의 가로세로 비율을 지정하여, 한쪽 크기만 설정해도 비율에 맞게 다른 쪽이 자동 계산된다
B overflow: auto와 overflow: scroll은 항상 동일하게 동작하는 속성이다
C float 속성이 적용된 요소는 display가 자동으로 inline으로 변경된다
D overflow: visible이 기본값이며 내용이 넘치면 자동 스크롤바가 생긴다

해설

aspect-ratio: 16/9 처럼 설정하면 width만 지정해도 height가 자동으로 계산됩니다. 반응형 비디오 컨테이너, 카드 레이아웃 등에서 일관된 비율을 유지할 때 유용합니다. 이전에는 padding-top 해킹으로 구현하던 것을 깔끔하게 대체합니다.

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

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

정규반 살펴보기

관련 문제

CSS에서 z-index가 예상대로 동작하지 않는 대표적인 원인은?
CSS
CSS shape-outside 속성의 용도로 올바른 것은?
CSS
CSS isolation: isolate 속성의 용도는?
CSS
CSS로 여러 줄 텍스트를 말줄임(...)으로 표시하기 위해 사용하는 -webkit-line-clamp 속성의 동작 조건은?
CSS
CSS gap 속성의 용도는 무엇인가요?
CSS