[CSS] 3D 표현하기 (ex. 단면 카드, 양면 카드)
·
css
# 단면 3D 카드 만들기 - card.html CARD CARD CARD 어떤 컨테이너 안에 카드 3장이 있습니다. 그 카드를 60도 만큼 Y축을 기준으로 돌려본다면 이 화면은 3D가 아니기 때문에 아래 화면 처럼 나올겁니다. 입체가 아니기 때문에 카드를 돌려도 평면으로 나와 크기가 줄어든거처럼 보입니다. 이걸 해결하기 위해선 카드를 잡고있는 영역을 3D 공간으로 만들어줘야하는데 이때 사용하는 속성이 perspective 입니다. 스페이스 영역에 속성을 추가해보겠습니다 .space { display: flex; justify-content: center; align-items: center; gap: 100px; width: 80vw; height: 80vh; background: #e0e0e0; pe..
개발짜옹
'3D 표현 CSS' 태그의 글 목록