线性渐变

颜色渐变 — 应用在元素的背景上

渐变分为两种：线性渐变 和 径向渐变

linear-gradient() 线性渐变

Tip：线性渐变的初始颜色变化默认是从上到下。
	而且，渐变必须设置在background的身上。
	
	background-image: linear-gradient;


首先，线性渐变是支持多个颜色渐变的。
	background: linear-gradient(red,yellow,blue,pink);

设置渐变方向：
	background: -webkit-linear-gradient(bottom,red,pink);
如果在参数里直接设置方向，那么需要加浏览器前缀。
如果在方向的前面加上to，那么就不需要加浏览器前缀。
	background: linear-gradient(to left,red,pink);
	to left 、 to right 、 to top 、to bottom ,没有to center
当然，关于方向我们也可以组合来使用：
	to left top 或者top left bottom.....
	
我们除了设置具体的方向值，还可以通过  angle 来设置角度。

	在代码中deg表示角度
		0deg表示从下向上
		如果角度为正，则为顺时针，如果角度为负，则为逆时针。
		
渐变百分比
	background: linear-gradient(to left,red 10%,black 90%);
	方向：从右到左，
		表示从起始方向开始，从右向左的10%为纯红色，从10%到90%为红色向黑色的渐变色，剩下的
		为纯黑色。
		
	练习：
		红、绿、蓝、黄
		
		灰  绿 灰  绿  
		
线性渐变在IE:
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',
	endColorstr='#ff0000',GradientType='1');   
GradientType = 0 方向是从上向下  1为从左向右

重复线性渐变
	一个渐变的过程已经完成，后续重复的进行这个过程。
	repeating-linear-gradient() ;

radial-gradient:径向渐变
方向：
left top right bottom ，前面要加webkit
也可以设置具体的值：apx bpx
还可以设置圆的形状：
正圆:circle
椭圆:ellipse