精灵图动画

于2022-12-15 11:07:34发布
<!doctype html>
<html lang="zh-cn">
<head>
	<meta charset="gbk">
	<meta name="Description" content="">
	<meta name="Keywords" content="">
	<style>
		div {
			width: 165px;
			height: 200px;
			background-size: 660px 200px;
			background: url('images/s.png') no-repeat 0 0;
			-webkit-animation: run steps(4) 0.5s infinite;
		}
		@-webkit-keyframes run {
			0% {
				background-position: 0 0;
			}
			100% {
				background-position: -660px 0;
			}
		}
	</style>
</head>
<body>
	<div></div>
</body>
</html>