css有几种插件模式

html-css055

css有几种插件模式,第1张

纯css3超酷tabs选项卡动画特效插件

这是一款使用纯css3制作的超酷tabs选项卡动画特效插件。该tabs选项卡插件共有5种特效,分别是淡入淡出、弹性放大缩小、上下滑动、来回翻转等特效

效果演示:http://www.htmleaf.com/css3/animation/2014100764.html

下载地址:http://www.htmleaf.com/Demo/2014100762.html

6、纯css3炫酷加载loading动画特效插件

这是一款通过CSS animation创建的类似gif加载图片的纯css3加载loading动画插件。这个css3加载loading动画插件集成了5种炫酷效果,有旋转、放大缩小、风车效果和太阳系9大行星效果。

效果演示:http://www.htmleaf.com/css3/css3donghua/20141117510.html

下载地址:http://www.htmleaf.com/Demo/20141117511.html

css3 翻转和旋转的区别如下:

概述:css3中的transform中有旋转,放缩,倾斜,平移的功能,分别对应的属性是:rotate,scale,skew,translate

1、旋转,利用rotate来实现,代码如下:

-webkit-transform:rotate(10deg)指定浏览器内核为webkit的翻转方式

-moz-transform:rotate(10deg)指定firefox浏览器私有属性

transform:rotate(10deg)一般浏览器翻转的角度为10弧度

2、 翻转,利用scale来实现,代码如下:

scale本来是放缩的意思,原来括弧里面(1,1)前者表示X轴,后者表示Y轴,当数字大于1时放大,大于0并小于1时缩小,负数代表翻转

水平翻转:

-webkit-transform:scale(-1,1)水平轴为-1,代表水平翻转

-moz-transform:scale(-1,1)水平轴为-1,代表水平翻转

transform:scale(-1,1)水平轴为-1,代表水平翻转

垂直翻转:

-webkit-transform:scale(1,-1)垂直轴为-1,代表垂直翻转

-moz-transform:scale(1,-1)垂直轴为-1,代表垂直翻转

transform:scale(1,-1)垂直轴为-1,代表垂直翻转