Thuộc tính animation-name

Thuộc tính animation-name thiết lập tên của animation (hoặc các animation) sẽ được áp dụng cho phần tử này. Tên của animation phải giống với tên được đặt khi xác định các khung hình chính @keyframes.

Cú pháp

cssbộ chọn {
  animation-name: tên animation;
}

Ví dụ

Trong ví dụ này, animation có tên là move:

html<div id="elem"></div>

css@keyframes move {
  from {
    margin-left: 0px;
  }
  to {
    margin-left: 400px;
  }
}

#elem {
  animation-name: move;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  border: 1px solid black;
  width: 50px;
  height: 50px;
}

Результат:

Xem thêm