‹ CSS

@keyframes

Define las etapas de una animacion mediante puntos porcentuales (0%, 50%, 100%), que luego se activan con la propiedad animation.

Vista previa

Codigo

ejemplo.html
<style>
  @keyframes deslizar {
    from { transform: translateX(0); }
    to { transform: translateX(120px); }
  }
  .caja { width: 40px; height: 40px; background: #191919; animation: deslizar 1.5s ease-in-out infinite alternate; }
</style>
<div class="caja"></div>