본문 바로가기 메뉴 바로가기

Programmers

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

Programmers

검색하기 폼
  • 개발 노트 (287)
    • VUEJS (21)
    • JAVA (3)
    • Python (10)
    • HTML CSS JS (72)
    • Servlet JSP (67)
    • JDBC (19)
    • Oracle Database (21)
    • POSIX CLI (13)
    • Git (34)
    • 알고리즘 (4)
    • 개발자 취업 준비 (8)
    • 스크랩 [정보] (1)
    • 이것저것 정리 (6)
  • 방명록

transform: skew() (1)
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
이전 1 다음
이전 다음
공지사항

Blog is powered by Tistory / Designed by Tistory

티스토리툴바