zoukankan      html  css  js  c++  java
  • 兔斯基实现

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style type="text/css">
                *{
                    padding: 0;
                    margin: 0;
                }
                #tsj{
                    position: absolute;
                    width: 48px;
                    height: 48px;
                    left: 50%;
                    top: 50%;
                    /*transform有限制,不能重复用两个,这样子只会有一个生效,这样子的话,就annimation就有作用了*/
                    /*transform: translate3d(-50%,-50%,0);

               整个动作只有一步,在时间为 0 处,position 设置为 start 时动画的第一步已执行完成
               相同情况下,position 设置为 end ,当时间为 0 时动画的第一步尚未开始


    */ margin-left: -50px; margin-top: -50px; border-radius:50% ; background: url(img/animation.png); animation: move 1s steps(12,end) infinite; } @keyframes move{ from{background-position: 0 0;} to{background-position: -576px 0;} } </style> </head> <body> <div id="tsj"> </div> </body> </html>
  • 相关阅读:
    bash 学习笔记5
    zookeeper启动脚本修改
    java enmu 使用说明
    bash 学习笔记4
    zookeep集群搭建说明
    bash 学习笔记3
    集群配置问题
    hadoop hdfs 总结(1)
    bash 学习笔记6
    bash pitfall
  • 原文地址:https://www.cnblogs.com/caicaihong/p/9673408.html
Copyright © 2011-2022 走看看