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

CSS의 개별 변환 속성(translate, rotate, scale)이 기존 transform 속성과 다른 점으로 올바른 것은?

보통 MDN Web Docs
보기 및 정답
A 각 변환을 독립적으로 설정하고 애니메이션할 수 있어, 하나의 변환만 변경해도 다른 변환에 영향을 주지 않는다
B @keyframes에서 동일한 퍼센트 값을 여러 번 선언하면 마지막 선언이 아닌 첫 번째 선언만 적용되는 것이다
C animation-iteration-count를 infinite로 설정하면 메모리 누수가 발생한다
D transition 속성은 요소가 DOM에 처음 삽입되는 시점에도 자동으로 전환 효과가 적용되어 부드럽게 나타나는 것이다

해설

개별 변환 속성(translate, rotate, scale)은 각각 독립적으로 선언할 수 있어, 하나의 변환만 애니메이션하고 싶을 때 다른 변환 값을 함께 다시 쓸 필요가 없습니다. 예를 들어 hover에서 scale만 변경해도 기존 translate 값이 유지됩니다.

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

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

정규반 살펴보기