반응형 고무줄 박스1 BoxStretch 애니메이션 BoxStretch 애니메이션 Code pen을 사용하여 BoxStretch(늘어나는 박스) 애니메이션을 만들어보았습니다. See the Pen Box_stretch by sukjun2 (@sukjun2) on CodePen. HTML 상자를 의미하는 cube 클래스 내부에 각 면이 될 6개의 div태그를 만들어줍니다. 코터틀 CSS 배경색을 설정하고, 부모인 cube 클래스에 애니메이션 회전 효과와 원근감이 표현되도록 preserve-3d 효과를 줍니다. 내부 div태그의 중앙정렬과 위치를 설정하고 nth-child를 통하여 각 면의 색과 회전 각도, 방향, 회전 중심, 애니메이션을 설정해주면 끝입니다...? body { background-color: black; height: 100vh; persp.. 2022. 9. 25. 이전 1 다음 반응형
