[CSS] cubic-bezier

cubic-bezier란?

cubic-bezier() 은 CSS의 transition 속성에서 전환 시작과 끝까지의 효과를 제어하는데 쓰인다. easing 효과를 대신해서 trasition을 부드럽게 제어할 수 있다.

Example

• 해당 엘리먼트의 width를 0.5초 동안 제어하되,
• 4개의 컨트롤 포인트(0.25, 0.25, 0.75, 0.75)를 가지는 cubic-bezier curve에 의거해 효과 주기

#target{
	transition: width 0.5s cubic-bezier(0.25, 0.25, 0.75, 0.75);
}