<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style type="text/css">

        #img{

            width:200px;

            height:200px;

            border:100px solid green;

            border-left-color: red;

            border-right-color: black;

            border-top-color: yellow;

            margin:100px;

            border-radius:50%;

            -webkit-animation:circle 1s infinite linear;

            -moz-animation:circle 1s infinite linear;

        }

        @-webkit-keyframes circle{

            0%{ transform:rotate(0deg); }

            100%{ transform:rotate(-360deg); }

        }

        @-moz-keyframes circle{

            0%{ transform:rotate(0deg); }

            100%{ transform:rotate(-360deg); }

        }

    </style>

</head>

<body>

<div id="img"></div>

</body>

</html>

　　

h5旋转效果的更多相关文章

  1. H5页面背景音乐，C33 360°旋转效果

    在做H5页面的时候,经常会需要用到背景音乐,比如电子贺卡.动态音乐相册等,右上角有个360°旋转的音乐图标,点击可以控制音乐是否播放,那这个效果是如何实现的呢?我现整理了一下代码:  Demo  点击 ...

  2. 旺财速啃H5框架之Bootstrap（五）

    在上一篇<<旺财速啃H5框架之Bootstrap(四)>>做了基本的框架,<<旺财速啃H5框架之Bootstrap(二)>>篇里也大体认识了bootst ...

  3. 旺财速啃H5框架之Bootstrap（四）

    上一篇<<旺财速啃H5框架之Bootstrap(三)>>已经把导航做了,接下来搭建内容框架.... 对于不规整的网页,要做成自适应就有点玩大了.... 例如下面这种版式的页面. ...

  4. H5单页面手势滑屏切换原理

    H5单页面手势滑屏切换是采用HTML5 触摸事件(Touch) 和 CSS3动画(Transform,Transition)来实现的,效果图如下所示,本文简单说一下其实现原理和主要思路. 1.实现原理 ...

  5. 快速构建H5单页面切换骨架

    在Web App和Hybrid App横行的时代,为了拥有更好的用户体验,单页面应用顺势而生,单页面应用简称`SPA`,即Single Page Application,就是只有一个HTML页面的应用 ...

  6. 07. Web大前端时代之：HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

  7. 旺财速啃H5框架之Bootstrap（三）

    好多天没有写了,继续走起 在上一篇<<旺财速啃H5框架之Bootstrap(二)>>中已经把CSS引入到页面中,接下来开始写页面. 首先有些问题要先处理了,问什么你要学boot ...

  8. H5程序员如何利用cordova开发跨平台应用

    什么是Cordova? Cordova以前也叫PhoneGap,它提供了一组设备相关的API,通过这组API,移动应用能够以JavaScript访问原生的设备功能,如摄像头.麦克风等.Cordova还 ...

  9. H5项目开发分享——用Canvas合成文字

    以前曾用Canvas合成.裁剪.图片等<用H5中的Canvas等技术制作海报>.这次用Canvas来画文字. 下图中"老王考到驾照后"这几个字是画在Canvas上的,与 ...

随机推荐

  1. YCSB-mapkeer-leveldb实测

    使用thrift0.8.0编译好java版的mapkeeper并安装到ycsb下,使用thrift0.9.2编译好c++版的mapkeeper并编译leveldb客户端运行. 测试成功.recordc ...

  2. 精选Java面试题（二）

    Java中的方法覆盖重写(Overriding)和方法重载(Overloading)是什么意思? Java中的方法重载发生在同一个类里面两个或者是多个方法的方法名相同但是参数不同的情况.与此相对,方法 ...

  3. 物理机装kali复盘

    复盘总结 最近把旧电脑想刷成kali的单系统,便下载了最新版本的kali 2018.1 的镜像文件.由此出现了很多问题. 首先在制作启动盘的时候,我用了很多软件,比如Ultriso,rufus,uni ...

  4. Field 'CID' doesn't have a default value

    解决:在数据库客户端navicat中设计表勾选自动递增

  5. OpenCV在Zedboard上的移植

    OpenCV编译 本文的前提是zynq交叉编译环境设置 下载opencv3.1.0源码,并解压 wget https://github.com/Itseez/opencv/archive/3.1.0. ...

  6. JavaScript-Tool：jquery.zsign(电子签章)-un

    ylbtech-JavaScript-Tool:jquery.zsign(电子签章) 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   作 ...

  7. 优化 SQL Server CPU 性能

    本文將探討在使用SQL Server時有那些原因可能會造成過度消耗CPU資源,若CPU使用率管理不善或過度使用CPU資源的話,可能會對SQL Server有明顯的影響,建議您需要增加或更換CPU.. ...

  8. springmvc源码分析系列-请求处理流程

    接上一篇-springmvc源码分析开头片 上一节主要说了一下springmvc与struts2的作为MVC中的C(controller)控制层的一些区别及两者在作为控制层方面的一些优缺点.今天就结合 ...

  9. nohup、&、tail 在服务启动中的用法

    在利用命令行启动各类服务的时候,控制台一般会显示相关日志信息,如果weblogic的启动,我们可能有这样需求:启动服务器后即使关闭控制服务器依然运行 ,日志不但可以在控制台显示同时也记录里后台日志文件 ...

  10. java 关于getProperty()方法中反斜杠问题

    问: 在配置文件a.properties中有一行path=C:\test在java中getProperty("path")后,java把\t认为是一个字符TAB.怎样才能取到正确的 ...