我正在尝试使用 webkit 转换让文本从左向右滑动。我意识到我可以用<marquee>它来做到这一点（即使它正在消失），但我需要使用关键帧更好地控制动画。下面的 CSS 似乎没有向任何方向移动文本，我无法想象为什么。
HTML：
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="test.css" type="text/css">
</head>
<body>
<div id="container">
<header>
<h1>Some header test sliding</h1>
</header>
</div>
</body>
</html>
CSS：
#container header h1{
-webkit-animation-name: slider;
-webkit-animation-duration: 26s;
-webkit-animation-timing-function: linear;
}
@webkit-keyframes slider{
0%{
-webkit-transform: translateX(0);
}
70%{
-webkit-transform: translateX(0);
-webkit-transform: translateX(175px);
}
75%{
-webkit-transform: translateX(85px);
}
80%{
-webkit-transform: translateX(55px);
}
85%{
-webkit-transform: translateX(35px);
}
}