CSS) 변환 2D 속성 transform: translate(30px, 30px)
1) transform position을 사용하게되면 부하가 걸리게된다. transform와 같이 애니매이션에 특화된 속성을 사용해야 한다. 사용법 1. position을 이용한 애니메이션 효과(잘못된 사용방법) html 123 css .box { width: 200px; height: 200px; background: tomato; display: flex; justify-content: center; align-items: center; font-size: 30px; transition: 1s; position: relative; left: 0; top: 0; } .box:hover { position: relative; left: 100px; top: 30px; } ※ rendering이 다시 되기..
HTML CSS JS
2021. 9. 23. 08:14
공지사항