zoukankan      html  css  js  c++  java
  • 小人行走的动画案例

      小人行走动画的案例:

      <!DOCTYPE html>
      <html>
        <head>
          <meta charset="UTF-8">
          <title></title>
          <style>
            *{
              margin:0;
              padding:0;
            }
            .div{
              200px;
              height:180px;
              position:absolute;
              top:100px;
              left:100px;
              background:url(01.png) no-repeat;                                        /* 背景图片自己找  */
              animation:name 1.8s steps(8) infinite;         /* steps(8)  意思是 播放速度 逐帧播放   在css animation中有介绍  */
            }
            @-webkit-keyframes name{
              from{background-position-x:0px;}
              to{background-position-x:-1600px;}
            }
          </style>
        </head>
        <body>
          <div class="div"></div>
        </body>
      </html>

      这是我找的图片   找类似这样的   此图是我在梦幻西游中找的 

      

  • 相关阅读:
    书签快捷键0
    msxml3.dll 执行页内操作时的错误
    DrawGrid DrawFocusRect
    RAD XE8
    Richview 首页 奇偶页 不同页眉页脚
    改变画布大小
    c# 数据集调试工具插件
    数据库连接补丁 驱动
    怎么关闭百度推广
    被封的著名网站
  • 原文地址:https://www.cnblogs.com/shangjun6/p/10703954.html
Copyright © 2011-2022 走看看