css - 一旦完成操作，如何使CSS转换保持不变

一旦转换完成，我试图使文本保持在最终位置。可以仅使用CSS吗？

这是我在JSFiddle中的代码。 https://jsfiddle.net/ogfcrtmL/

<!DOCTYPE html>
<html>
<head>
<title>Hello</title>
</head>
<style>
#movetxt {
    -webkit-animation: moving 5s;
    animation: moving 5s;
}
@-webkit-keyframes moving {
    from {-webkit-transform: translateY(0px);}
    to {-webkit-transform: translateY(200px);}
}
@keyframes moving {
    from {transform: translateY(0px);}
    to {transform: translateY(200px);}
}
h1 {
    font-size: 60px;
    text-align: center;
    color: #152835;
}
p {
    font-size: 40px;
}
</style>
<body>

<h1 id="movetxt">Header</h1>
</body>
</html>

一旦完成操作，如何使CSS转换保持不变

0 个答案: