transition

서민수·2023년 7월 12일
0

HTML 기초

목록 보기
11/18

transition

transition-property, transition-duration, transition-timing-function과
transition-delay를 위한 단축 속성이다.
이 속성으로 엘리먼트의 두 가지 상태 사이에 변화를 줄 수 있다.

transition-property

transition-property : none; = 아무것도 바꾸지 않겠다.
transition-property : all; = 가지고 있는 모든 css를 변경하겠다.
transition-property : margin-left; = 특정 값만 바꾸겠다.

transition-duration

margin-right를 500ms만큼 바꾸겠다.
transition-duration: 500ms;
transition-property > margin-right;

transition-delay

transition-delay는 transition 요청을 받은 이후 실제로 transition하기까지 기다려야하는 시간.

transition-shorthand

/*             property name | duration | timing function | delay
   transition: margin-left     4s        ease-in-out        1s;
profile
안녕하세요

0개의 댓글