Html 如何将我的图片动画到另一个点

新的HTML和CSS。有人能教我如何将我的图片从当前点移动到另一个位置吗？例如，从“顶部：280px：左侧600px；”移动到“顶部：180px；左侧500px；”

需要有人陪我走，谢谢。 以下是我目前的代码：

#机器人{
位置：固定；
顶部：280px；
左：600px；
边界半径：50%；
宽度：50px；
高度：60px；
}
身体{
身高：100%；
宽度：100%；
背景图片：url（'TPHRG floorplan 1.png'）；
背景重复：无重复；
背景附件：固定；
/*背景位置：中心*/
背景尺寸：980px400px，封面；
}

---

这里是一个到位置转换的简化示例

关键是将

转换

规则添加到元素（

#robot

），在其中设置要设置动画的属性、动画的持续时间、缓和功能等

请注意，如果您在上述规则中使用

all

关键字以便于速记，则建议您在附加的

转换属性

规则中设置动画。这是出于性能原因

在我的示例中，我使用

：hover

来触发动画，但也可能是在页面加载时，或者某个类被某些JavaScript添加到元素中时

希望有帮助

.box{
宽度：500px；
高度：150像素；
位置：相对位置；
填充：10px；
边框：5px纯绿色；
}
猫先生{
位置：绝对位置；
顶部：50px；
左：50px；
过渡：所有1都容易进入；
过渡属性：顶部、左侧；
}
.盒子：悬停.猫{
顶部：10px；
左：300px；
}

让我停下来！

是的，您可以通过简单地使用css来实现

#机器人{
位置：固定；
顶部：280px；
左：600px；
边界半径：50%；
宽度：50px；
高度：60px；
-webkit动画名称：示例；/*Safari 4.0-8.0*/
-webkit动画持续时间：4s；/*Safari 4.0-8.0*/
动画名称：示例；
动画持续时间：4s；
}
身体{
身高：100%；
宽度：100%；
背景图片：url（'TPHRG floorplan 1.png'）；
背景重复：无重复；
背景附件：固定；
/*背景位置：中心*/
背景尺寸：980px400px，封面；
}
/*Safari 4.0-8.0*/
@-webkit关键帧示例{
从{顶部：280px；左侧：600px；}
至{顶部：180px；左侧：500px；}
}
/*标准语法*/
@关键帧示例{
从{顶部：280px；左侧：600px；}
至{顶部：180px；左侧：500px；}
}

是一个简单的Javascript动画教程，我建议您遵循它并将其调整为

顶部

和

左侧

，而不是当前正在更改的

颜色和
位置。因此，这不是一个教程网站，如果您想获得进一步的帮助，请提供您尝试过的内容和面临的错误的证据，以便我们可以在更高的技术能力方面为您提供帮助。对于动画，应该有一些触发点，动画可以工作。例如onload、onclick等等，您必须使用javascript或CSS创建触发器。现在一天CSS也单独用于动画。这是javascript的链接和其他链接，非常感谢。你真的帮了我很多。我仍然打算用这段代码来编辑：谢谢你的帮助。我已经使用了上面的人和你的代码。