WEB기초/CSS
[CSS] CSS3 이용하기 02 (170410)
별토끼.
2017. 4. 10. 18:01
반응형
CSS3 이용하기 02
- 3D Transform
- perspective :컨텐츠와 내 시선 사이의 거리 (wrapper 요소)
- perspective-origin: 50% 50% ; 시선의 위치 결정 (wrapper 요소)
- transform-style : preserve-3d ; 3d transform을 하겠다고 선언
- transform-origin : 50% 0%; x, y, z축이 만나는 원점 설정 (x% y%)
** 출력 결과 **
- CSS3를 이용한 카드 뒤집기
** 출력 결과 **
|
- 버튼 클릭하면 뒤집어지는 카드
** 출력 결과 **
|
반응형