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

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

Ví dụ

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

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

@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

thuộc tính animation-duration,
thiết lập thời lượng của animation
thuộc tính animation-delay,
thiết lập độ trễ trước khi thực thi animation
thuộc tính animation-timing-function,
thiết lập tốc độ thực thi của animation
thuộc tính animation-iteration-count,
thiết lập số lần lặp của animation
thuộc tính animation-direction,
thiết lập hướng của animation
thuộc tính animation-fill-mode,
thiết lập trạng thái của animation
thuộc tính animation-play-state,
cho phép tạm dừng animation
thuộc tính animation,
là cách viết tắt cho các animation
lệnh @keyframes,
xác định các khung hình chính của animation
các hiệu ứng chuyển tiếp mượt mà transition, đại diện cho một animation khi di chuột vào phần tử