如何做出炫酷的CSS效果

今天来说说如何做出炫酷的CSS效果
很多人不知道什么叫CSS，今天我来用比较通俗的语言解释给大家听
以免总有人嫌弃说看不懂我说的到底是什么东西。

很简单，CSS能够创造出大部分，哦不，可以说是一切的页面能够显示出的动作效果
也就是说，如果你看到“别人家”移动专题有什么小天使在飞啊，小雨点在飘啊，等等此类，都是最简单的CSS效果能够达到的啦，也就是今天我要说的这种，稍微难一点的变换我们下次再讲哦~~

说回来，先来一段简单的代码给你们看看：

//如果你在页面上看见这样的代码：
<img id='image1' src='img1' style='animation:bounce'></img>
这就是一串代表图片元素的代码啦。

其中，

id 是一种用来分辨元素的方式，就像把一堆元素分到一个组合中一样
当然，也可以让一个元素自己成为一个组合，
总之就是这个组合一旦被调用，是一定要一起进行动作的。

src 是引用元素的标记，“=”后面跟着的就是引用元素的路径和名称。

style 就是CSS代码能够出现的地方了。
如果你希望让一个元素呈现出动作，在这个地方设置是最简单不过的了
只需要将animation后面的词汇做改动，相应的动作就会发上变化了。

至于要加什么词汇，有个比较简单的规律：

跳动：bounce
闪烁：flash
摇动：shake
淡入：fade
光速：lightSpeed
放大缩小：zoom

知道这些，自己就可以进行移动的发挥了：
比如说，bounceInLeft，就是从左边跳动进入，大概这种。
记得后面单词不要空格，大写第一个字母就好。

在这边给大家放一个特别好用的网址，能够直接显示出效果预览，
简直好用到飞起，可以收藏起来：
http://www.html5tricks.com/demo/css3-animate-css/index.html
截图是这样的：

这就是给单个元素添加CSS动作的方法
但是这个方法如果元素太多会变得比较麻烦，就要单独建立CSS文件进行控制啦
这个我们有空继续说~~
今天就先说这么多吧！

你们快去试试那个敲好用的网站！！绝对良心推荐