CSS动画 是什么？
CSS 中的动画类似于 flash 中的逐帧动画，表现细腻并且非常灵活，使用 CSS 中的动画可以取代许多网页中的动态图像、Flash 动画或者 JavaScript 实现的特殊效果。
这里感兴趣的可以去了解针 动画是什么
常用的css动画属性
:transitionend
-transition: 过渡动画
-transition-property : 属性
-transition-duration : 间隔
-transition-timing-function : 曲线
-transition-delay : 延迟
animationend
-animación/keyframes
-animation-name: nombre de la animación, correspondiente a @keyframes
-animation-duration: intervalo-
animación-timing-function: curve-animation
-delay: delay-
animation-iteration-count: times
-infinite: ciclo de animación
- animación -dirección: dirección
-alternativa: reproducir en reversa
-animación-rellenar-modo: modo fijo
-adelante: cuando se detiene, mantener el último cuadro
-hacia atrás: cuando se detiene, volver al primer cuadro
-ambos: usar adelante / atrás en al mismo tiempo
Propiedades de animación: intente usar propiedades de animación para la animación, que pueden tener un mejor rendimiento
-traducir
-escala
-rotar
-sesgar
-opacidad
-colo
ejemplo
El atributo animation-name se utiliza para vincular la animación al elemento HTML especificado. Los valores opcionales del atributo son los siguientes:
<style>
@keyframes ball {
0% {
top: 0px; left: 0px;}
50% {
top: 200px; left: 200px;}
100% {
top: 0px; left: 0px;} // 回到初始的位置
}
div {
width: 50px;
height: 50px;
border: 10px solid red;
position: relative;
animation-name: ball;
}
</style>
Lo anterior es la animación CSS. Gracias por leer.
Si encuentra otros problemas, puede discutir y estudiar conmigo en privado.
Si le resulta útil, 点赞márquelo como favorito. ¡Gracias ~!
Preste atención a los bloggers favoritos y continuará actualizando...