[已解决]html动画为什么无法运行？

如你狂热 · 发表于 2020-11-24 16:28:12

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

代码在我的电脑上打开无法正常运行，目的是一个小方块从左移动到右边，没有过程直接跳到右边

在网页中检查，演示动画的那几行代码都无法运行，
<!DOCTYPE html>
<html>
<head>
<title>移动</title>
<meta charset="utf-8">
<style type="text/css">
div{
width: 100px;
height: 100px;
background-color: red;
position: relative;
animation-name: web;
animation-duration: 5s;
animation-timing-function: linear;
-webkit-animation-name:web;
-webkit-animation-duration:5s;
-webkit-animation-timing-function:linear;
}
@keyframes web{
form {left: 0px;}
to {left: 200px;}
}
@-webkit-keyframes web{
from {left: 0px;}
to {left: 200px;}
}

</style>
</head>
<body>
<div></div>
</body>
</html>

检查是这个样子的
div {
width: 100px;
height: 100px;
background-color: red;
position: relative;

（animation-name: web;
animation-duration: 5s;
animation-timing-function: linear;）这三行代码被划掉的

-webkit-animation-name: web;
-webkit-animation-duration: 5s;
-webkit-animation-timing-function: linear;
}

最佳答案

月排行榜 / 总排行榜

Darth_EF

2020-11-24 16:37:34

form是错的，from才是对的
拼写都拼错(汗)

from {
top: 0px;
}
to {
top: 200px;
}

复制代码

跳转到最佳答案楼层

Darth_EF · 发表于 2020-11-24 16:37:34

这个最佳答案由 Darth_EF 给出，感谢 Darth_EF 的回答。

单击隐藏图章

form是错的，from才是对的
拼写都拼错(汗)

from {
top: 0px;
}
to {
top: 200px;
}

复制代码

xxm8023 · 发表于 2021-2-25 14:40:18

form拼写错误，应该是from！
之所以那三行被划是因为Chrome不支持，具体看下图！

账号		自动登录	找回密码
密码			立即注册