몽땅뚝딱 개발자

[CSS] Transition 본문

Development/HTML · CSS

[CSS] Transition

레오나르도 다빈츠 2023. 3. 27. 22:56

 

Transition

- transition-property: all;

- transition-duration: 1s;

- transition-timing-function: ease;

- transition-delay: 0s;

transition: 1s 2s; // 1초동안 발생, 2초간 딜레이

 

transition-timing-function의 종류

- linear: 가속도 없이 일정한 속도로 진행된다.

- cubic-bezier(0.34, 0.67, 0.59, 1.62);

 

가속도를 직접 지정할 수도 있다.

 

 

 


 

 

 

출처

 

인터랙티브 웹 개발 제대로 시작하기 - 인프런 | 강의

크리에이티브 넘치는 인터랙티브 웹페이지를 개발할 수 있는 기본기를 다질 수 있는 수업입니다., - 강의 소개 | 인프런

www.inflearn.com

 

'Development > HTML · CSS' 카테고리의 다른 글

[CSS] 3D  (0) 2023.03.28
[CSS] animation과 keyframe  (0) 2023.03.27
[CSS] Transform  (0) 2023.03.27
[HTML/CSS] 이런 방법도 있었네! + 미세팁  (0) 2023.03.25
[HTML] fieldset  (0) 2023.02.12
Comments