CSS3新特性

新增选择器

1.样式选择器

可以通过标签的样式选择便签
如input[type=“text”]可以选择到所有类型为文本的input标签

2.伪类选择器

（1）静态伪类

1. ：link 超链接点击之前的样式
2. ：visited 超链接点击之后的样式

（2）动态伪类

1. ：hover 鼠标悬浮时候的样式
2. ：active 鼠标点击后，未松手时候的样式
3. ：focus 获得焦点时候的样式
   ps：以上三种样式，只能用于超链接

a{}和a:link{}的区别：

a{}定义的样式针对所有的超链接(包括锚点)
a:link{}定义的样式针对所有写了href属性的超链接(不包括锚点)

3.伪元素选择器（新增规范）

在css3的标准里，为了更好地区分伪类和伪元素，为伪元素多加了一个：

语法：selector ::伪元素{}

/* 为某个元素的第一行文字使用样式。 */
::first-line

/* 为某个元素中的文字的首字母或第一个字使用样式。 */
::first-letter

/* 在某个元素之前插入一些内容。 */
::before

/* 在某个元素之后插入一些内容。 */
::after

更多的颜色支持

css3新增了两种颜色支持：rgba和hsl

现在css共支持六种颜色模式

1. 关键字：如red，yellow …
2. rgb：由红，蓝，绿 三原色的0~255的数组成
3. 十六进制：#+6位（有的可缩写成3位）十六进制数组成
4. rgba，在rgb的基础上加入的透明度值
5. HSL模式：通过对色调(H)、饱和度(S)、亮度(L)三个颜色通道的变化以及它们相互的叠加得到各式各样的颜色。HSL标准几乎可以包括人类视力所能感知的所有颜色
6. HSLA模式：HSL的扩展模式，在HSL的基础上增加一个透明通道alpha来设置透明度

提供了渐变的效果

1.线性渐变

 background-image: linear-gradient(direction, color-stop1, color-stop2, ...);

2.径性渐变

background-image: radial-gradient(red 5%, yellow 15%, green 60%);

CSS3 的 Transitions, Transforms 和 Animation

Transitions

过渡属性，当指定样式被改变时控制他的改变速度和过渡模式

标准语法： transition：过度属性，持续时间，延迟时间，过渡模式
ps:可能需要加上浏览器前缀

Transforms

Transform，其实就是指拉伸，压缩，旋转，偏移等等一些图形学里面的基本变换

Animation

Animation ，它可以说开辟了 CSS 的新纪元，让网页摆脱了flash插件，可以直接制作一些简单的动画效果