Lucas-Li 2022-01-18 14:43 采纳率: 93.9%
浏览 37
已结题

css的平移怎样写在动画里面？

比如以下写法，但是没效果：

.anmin1{
      background:pink;
      animation:image1 infinite 2s;
      }
@keyframes image1{
      0%{translateX(0)}
      100%{translateX(-100px)}
      }
  • 写回答

2条回答 默认 最新

  • 归来巨星 前端领域新星创作者 2022-01-18 15:00
    关注

    transform: translateX(0);

    <!--
 * @Author: your name
 * @Date: 2021-12-30 16:59:23
 * @LastEditTime: 2022-01-18 15:00:13
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: /未命名文件夹/123.html
-->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>菜鸟教程(runoob.com)</title>
    <style>
      div {
        width: 100px;
        height: 100px;
        background: red;

        animation: myfirst infinite 5s;
      }

      @keyframes myfirst {
        0% {

          transform: translateX(0);
        }
        100% {

          transform: translateX(100px);
        }
      }
    </style>
  </head>
  <body>
    <p><b>注意:</b> 该实例在 Internet Explorer 9 及更早 IE 版本是无效的。</p>

    <div></div>
  </body>
</html>

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题？

问题事件

  • 已结题 （查看结题原因） 1月18日
  • 已采纳回答 1月18日
  • 创建了问题 1月18日

悬赏问题

  • ¥20 西门子S7-Graph,S7-300，梯形图
  • ¥50 用易语言http 访问不了网页
  • ¥50 safari浏览器fetch提交数据后数据丢失问题
  • ¥15 matlab不知道怎么改，求解答！！
  • ¥15 永磁直线电机的电流环pi调不出来
  • ¥15 用stata实现聚类的代码
  • ¥15 请问paddlehub能支持移动端开发吗？在Android studio上该如何部署？
  • ¥20 docker里部署springboot项目，访问不到扬声器
  • ¥15 netty整合springboot之后自动重连失效
  • ¥15 悬赏！微信开发者工具报错，求帮改