Este exemplo fornece 29 modelos de curvas de Bézier em CSS3, todos os códigos de conteúdo são provenientes da internet! Você pode usar esses modelos comuns de curvas de Bézier cúbicas por conta própria ou ajustar suas próprias animações de curvas de Bézier cúbicas usando uma ferramenta de curvas de Bézier. Uma curva de Bézier é composta por 4 pontos, a função de curva de Bézier em CSS3, o ponto de partida padrão tem coordenadas (0,0) e o ponto final tem coordenadas (1,1), portanto, você só precisa controlar os outros 2 pontos de direção para obter uma curva de Bézier completa! Apenas navegadores que suportam efeitos Css3 podem ver o efeito!
-webkit-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
-moz-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
-o-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);-webkit-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
-moz-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
-o-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
Você usou recentemente: