【HTML, CSS】動くCSSサンプル
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>動くCSSサンプル</title>
<!-- オリジナル CSS -->
<link rel="stylesheet" href="style.css" />
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<header>
<div class="box"></div>
</body>
</html>
.box {
width: 100px;
height: 100px;
background: #000;
animation: translate 1s linear infinite;
}
@keyframes translate {
0% {
transform: translate(0px, 0px);
}
100% {
transform: translate(500px, 0px);
}
}