CSS3基本属性Gradient----渐变
现代浏览器的内核，主流内容主要有（熟悉的有Firefox，Flock等浏览器）、（熟悉的有Safari、Chrome等浏览器）、（Opera浏览器）、Trident（讨厌的IE浏览器）。
根据不同的内核，一些私有属性的css前缀不一样
Mozilla内核 css前缀-moz;
WebKit内核 css前缀-webkit ;
Opera 内核 css前缀 -o ;
Trident内核 css前缀 -ms ;
CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)。渐变一般是用来设置背景的-- background属性。
线性渐变: 是指从左到右、从右到左渐变或者从上到下、从下到上渐变。
径向渐变: 是指以某点为圆心根据指定的直径数实现的渐变。
linear-gradient(A,B,C) 线性渐变的参数 A :角度或者left、top, 即给定一个渐变的角度； 左表示从左到右渐变；上表示从上到下渐变
B: 起始处的渐变颜色； C: 终止处的渐变颜色
线性渐变在webkit下的应用：
在Mozilla和在Opera下只需要换个前缀就可以
在Trident下需要通过滤镜filter才能实现。
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#1471da, endColorstr=#1C85FB);/*IE<9>*/-ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#1471da, endColorstr=#1C85FB)";/*IE8+*/
startColorstr表示起点的颜色，endColorstr表示终点颜色。GradientType表示渐变类型，0为缺省值，表示垂直渐变，1表示水平渐变。
在Mozilla，Opera，webkit中方向也可以设置为左上到右下的渐变。
也可以设置渐变的颜色多样化：
以及渐变的颜色的宽度
角度：
如果不指定一个角度，它会根据起始位置自动定义。如果你想更多的控制渐变的方向，这时就可以设置角度。
当指定的角度，请记住，它是一个由水平线与渐变线产生的的角度，逆时针方向。因此，使用0deg将产生一个左到右横向梯度，而90度将创建一个从底部到顶部的垂直渐变
角度以逆时针方向转动
渐变上应用透明─透明度(Transparency)：
CSS3的径向渐变:
径向渐变到目前还不支持Opera的内核浏览器
radial-gradient : radial-gradient([方向或角度,]? [形状或大小,]? 颜色1, 颜色2[, 颜色3]*);
除了在线性渐变中看到的起始位置，方向，和颜色，径向梯度允许你指定渐变的形状（圆形或椭圆形）和大小（最近端，最近角，最远端，最远角，包含或覆盖 (closest-side, closest-corner, farthest-side, farthest-corner, contain or cover)）。size的不同选项(closest-side, closest-corner, farthest-side, farthest-corner, contain or cover)指向被用来定义圆或椭圆大小的点.
在径向渐变中虽然具有相同的起止色，但是在没有设置位置时，其默认颜色为均匀间隔，这一点和我们前面的线性渐变是一样的，但是设置了渐变位置就会按照渐变位置去渐变
注意：当你的div为正方形大小时，就算设置渐变形状为ellipse，它的渐变形状也只能按照circle来进行渐变。不能继续椭圆形渐变。
size:用来指定起始点(center)到圆|椭圆的近边的距离设定的，或从起始点到圆|椭圆远角的的距离决定的。