div
{
transform:rotate(180deg);
-ms-transform:rotate(180deg); /* IE 9 */
-moz-transform:rotate(180deg); /* Firefox */
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
-o-transform:rotate(180deg); /* Opera */
}

transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜

语法:transform:none|rotate(-8deg)...

也可以增加 keyframes 效果

@-webkit-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
} @-moz-keyframes spin {
from { -moz-transform: rotate(0deg); }
to { -moz-transform: rotate(360deg); }
} @-ms-keyframes spin {
from { -ms-transform: rotate(0deg); }
to { -ms-transform: rotate(360deg); }
} @-o-keyframes spin {
from { -o-transform: rotate(0deg); }
to { -o-transform: rotate(360deg); }
}

转换(旋转)transform的更多相关文章

  1. Direct2D教程VI——转换(Transform)

    目前博客园中成系列的Direct2D的教程有 1.万一的 Direct2D 系列,用的是Delphi 2009 2.zdd的 Direct2D 系列,用的是VS中的C++ 3.本文所在的 Direct ...

  2. CSS3的2D 转换——旋转,缩放,translate(),skew(),matrix()

    2D转换方法:在平面对元素进行旋转,缩放,移动,拉伸. ㈠浏览器支持 ⑴2D转换效果有以下的浏览器支持:   ⑵在编辑代码的时候要注明用哪种浏览器打开,在前面加上前缀,下面是编辑器的简写形式,以及前缀 ...

  3. CSS3 转换2D transform

    Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放scale和移动translate以及矩阵变形matrix.下面我们一 ...

  4. 如何在命令行下运行kettle的作业(job)和转换(transform)

    pan 是执行转换的. Pan.bat /file C:\test.ktr /logfile c:\log.txt /level Basic kitchen是执行job的. kitchen.bat / ...

  5. DirectX11 学习笔记2 - 加入关键事件 实现视角转换 旋转

    上的程序的的基础上.在基类D3DBase添加摄像头功能 //录影机 void D3DBase::setCamera() { //关键事件 //假定A,S,D,W,Q,E,Z,X,C键被按下.动摄像机 ...

  6. 定量变量和定性变量的转换(Transform of Quantitative & Qualitative Variables)

    定量变量(Quantitative Variables):也称为数值型变量(Numerical Variables),可以用连续值或离散值表示.比如:气温(连续值),学生人数(离散值). 为什么要对定 ...

  7. CSS3新特性汇总

    新增选择器 p:nth-child(n){color: rgba(255, 0, 0, 0.75)} 弹性盒模型 display: flex; 多列布局 column-count: 5; 媒体查询 @ ...

  8. LESS CSS 实例

    值得参考的 10 个 LESS CSS 实例   2 收藏(185) LESS, Sass 和其他 CSS 预处理器是一种超棒的方法用来扩展 CSS 功能,使之更适合程序员.你可以使用变量.函数.混合 ...

  9. 前端面试题之HTML和css-很实用的知识点

    display: none; 与 visibility: hidden; 的区别 相同: 它们都能让元素不可见 区别: display:none;会让元素完全从渲染树中消失,渲染的时候不占据任何空间: ...

  10. 面试BAT,你凭什么说你掌握了CSS

    介绍 项目已经开源:https://github.com/nanhupatar... 欢迎PR 推荐 关注我们的公众号 display: none; 与 visibility: hidden; 的区别 ...

随机推荐

  1. ARM Linux系统调用的原理

    转载自:http://blog.csdn.net/hongjiujing/article/details/6831192 ARM Linux系统调用的原理 操作系统为在用户态运行的进程与硬件设备进行交 ...

  2. Mac测试模拟慢网速

    先普及一下Kb,KB,Kbps,Mb,Mbps等一些列概念 1Byte = 8bit 1KB (Kilobyte 千字节)=1024Byte 1MB (Megabyte,兆字节,简称“兆”)=1024 ...

  3. tomcat使用安全及CVE-2017-12615

    tomcat安全情报的收集 1.首先定期查看官网各个版本存在的安全漏洞公告: http://tomcat.apache.org/security.html 2.去各大漏洞网站查看漏洞披露信息 看几个漏 ...

  4. circular-array-loop(蛮难的)

    https://leetcode.com/problems/circular-array-loop/ 题目蛮难的,有一些坑. 前后两个指针追赶找环的方法,基本可以归结为一种定式.可以多总结. pack ...

  5. 【C语言 C++】简单keywordRegister,Const,Static,Volatile,typedef,Define的理解

    Register 用register声明的变量称着寄存器变量,在可能的情况下会直接存放在机器的寄存器 中.但对32位编译器不起作用.当global optimizations(全局优化)开的时候,它会 ...

  6. windows的iis做后门,隐藏访问,无日志

    windows下的iis5/iis6做后门,隐藏访问,不留访问记录或者不留日志 好不容易攻下一台Windows2000/2003 IIS服务器,你一定会想,怎样才能长期占有这个“肉鸡”呢?聪明的你肯定 ...

  7. Galileo Gen2 之MQTT通讯

    前言 原创文章,转载引用务必注明链接.如有疏漏,欢迎斧正. Galileo系统:完整版Yocto,内核版本3.8.7-yocto-standard:宿主机:Windows 7 64 bit 这期主要讲 ...

  8. shell脚本学习笔记 (正則表達式)

    正則表達式一般有三个部分组成,他们各自是:字符类,数量限定符,位置限定符. 规定一些特殊语法表示字符类.数 量限定符和位置关系,然后用这些特殊语法和普通字符一起表示一个模式,这就是正則表達式(Regu ...

  9. OC中动态创建可变数组的问题.有一个数组,数组中有13个元素,先将该数组进行分组,每3个元素为一组,分为若干组,最后用一个数组统一管理这些分组.(要动态创建数组).两种方法

    <span style="font-size:24px;">//////第一种方法 // NSMutableArray *arr = [NSMutableArray a ...

  10. java jar包运行方法

    http://java-beginner-liyun.iteye.com/blog/736752一.怎么打jar包 第一步:选中要打jar包的工程 第二步:鼠标右击,选择Export... 第三步:选 ...