CSS3实现圆角 (border-radius: 8px)

阴影 (box-shadow: 10px)

对文字加特效 (text-shadow)

线性渐变（gradient）

旋转（transform)：rotate(9deg)

缩放 (transform)：scale(0.85，0.90)

倾斜（transform)：skew（-9deg，0deg）

过渡效果（transition)

动画效果（animation)

增加了更多的选择器

---

CSS3选择器

nth-child 

nth-last-child(n)

nth-of-type(n)

nth-last-of-type(n)

last-child

first-of-type

only-child

only-of-type

empty

checked

enabled

disabled

selection

not(s)

first-child：第一个直接字节点

 

---

 

CSS3的Animation

    
     
      box
     

animation有八个动画属性：

animation-name：              规定需要绑定到选择器的keyframe名称。

animation-duration：          规定完成动画所花费的时候，以秒或毫秒计。

animation-timing-function：规定动画的速度曲线， 设置动画播放方式。

animation-delay：               规定动画开始之前的延迟。

animation-iteration-count： 规定动画播放的次数。

animation-direction：          规定是否应该轮流反向播放动画。

animation-fill-mode：          规定当动画不播放时（当动画完成时，或当动画有一个延迟未开始播放时），要应用到元素的样式。

animation-play-state：        指定动画是否正在运行或已暂停。

 

语法：

animation: name duration timing-function delay iteration-count direction fill-mode play-state;

 

keyframes被称为关键帧，其类似于Flash中的关键帧。

    
     
      box