animation 秒简单笔记

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .biao {
            width: 300px;
            height: 300px;
            background-color: #FFFF8B;
            border-radius: 50%;
            border: 2px solid #E42837;
            position: relative;
        }

        .miaozhen {
            width: 4px;
            height: 150px;
            background-color: #000;
            position: absolute;
            left:50%;
            animation:go 60s infinite steps(60);
            /*steps()停一次*/
            transform-origin: center bottom;
        }
        @keyframes go {
            0%{
                transform: rotate(0deg);
            }
            100%{
                transform: rotate(360deg);
            }
        }
    </style>
</head>
<body>
    <div class="biao">
        <div class="miaozhen"></div>
    </div>
</body>
</html>

时间： 2024-10-13 06:55:36

animation 秒简单笔记的相关文章

applicationContext.xml简单笔记

applicationContext.xml简单笔记 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://

mybatis-config.xml简单笔记

mybatis-config.xml简单笔记 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd"> <configuration> <

jQuery的简单笔记

html css javaScript Ajax jQuery Java servlet jsp jdbc mysql oracle struts spring hibernate jdpm tomcat jUnit Ant Hadoop linux unix android sql server jQuery的简单笔记//使用JQuery输出 /* * jquery对象:需要用"$"来修饰 * * jquery获取页面标签:$()来包裹,通过"

Unity3d中SendMessage 用法简单笔记

Unity3d中SendMessage 用法简单笔记 Message相关有3条指令:SendMessage ("函数名",参数,SendMessageOptions) //GameObject自身的ScriptBroadcastMessage ("函数名",参数,SendMessageOptions) //自身和子Object的ScriptSendMessageUpwards ("函数名",参数,SendMessageOptions) //自

UI渲染回顾简单笔记

UI渲染的简单过程: CPU,GPU,显示器协同工作,CPU 中计算显示内容,比如视图的创建.布局计算.图片解码.文本绘制等,然后将计算结果提交给GPU,由 GPU 进行变换.合成.渲染.随后 GPU 会把渲染结果提交到帧缓冲区去,随后等待下一次 VSync(垂直同步信号) 到来时,视频控制器会逐行读取帧缓冲区的数据,经过可能的数模转换传递给显示器显示.由于垂直同步的机制,如果在一个 VSync 时间内,CPU 或者 GPU 没有完成内容提交,则那一帧就会被丢弃,等待下一次机会再显示,而这时显示

Innodb 锁（简单笔记）

看过很多innodb锁的文章,已经明白的就不写了,简单做个笔记 Innodb 锁的兼容性: 1.意向锁和意向锁之间都是兼容的 2.X(排他锁)与任何锁都是不兼容的 3.排他意向锁 IX 于S锁是不兼容的 4.剩下的锁都是兼容的三种锁 record lock gap lock next-key lock = record + gap 判断锁一定要加上隔离级别,不同级别锁的情况不同对于Innodb 一般只需要考虑RR 和 RC 隔离级别即可 RR 三种锁 RC 可以认为只有record锁,但是当

Python BeautifulSoup 简单笔记

body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI",Tahoma,Helvetica,Sans-Serif,"Microsoft YaHei", Georgia,Helvetica,Arial,sans-serif,宋体, PMingLiU,serif; font-size: 10.5pt; line-height: 1.5;

Varnish简单笔记（部分转载）

一.原理特点 Varnish是一个轻量级的cache和反向代理软件,有以下的优缺点: (1)基于内存进行缓存,速度比squid的硬盘缓存要快:但是varnish进程一旦出了问题,缓存数据就丢失了,后端的web服务器的压力会瞬间加大: (2)使用自有的VCL(Varnish Configuation Languege)管理,强大灵活: (3)通过管理端口,利用正则表达式删除指定的缓存: (4)基于内存IO较高,TCP链接释放快,可以支持较高的并发:同时,CPU\内存的开销较高: (5)支持0-60

Android Animation 动画学习笔记

最近两天学了android 动画方面的知识,从一点不懂到自己研究确实有收获. Animation 分为: <alpha /> 透明度渐变 <scale /> 尺寸渐变 <translate /> 位移动画 <rotate /> 旋转动画在XML 和在JavaCode中都可以定义,方法分别为 XML中 javaCode中 <alpha /> AlphAnimation <scale /> ScaleAnimat