CSS3中渐变叙述及应用

浏览器前缀：
-webkit-谷歌、苹果浏览器前缀

• ms-IE浏览器前缀
• moz-火狐浏览器前缀
  -o-欧朋浏览器前缀
  css3渐变：概念，背景色在多个颜色之间平稳的过渡。
  1、线性渐变：从一个方向到另一个方向的颜色变化。
  标准语法：（不添加浏览器前缀）
  background: linear-gradient(direction, color1, color2, …)
  说明：directiona:默认为to bottom，方向即从上向下来渐变。
  兼容模式语法：(添加浏览器前缀)
  说明：不加to，默认指是那个方向开始。
  1,渐变方向：to left/ to right /to top /tobottom
  2,对角渐变：to left top/ to right bottom
  3,对角渐变的角度的变化：标：40deg>40度 兼：50deg
  颜色加% 指从这个位置开始渐变。
  2、径向渐变：（必须加浏览器前缀）从一个点到四周的颜色渐变。
  语法：
  background: radial-gradient(center, shape, size, start-color…）
  background: -webkit- radial-gradient(center, shape, size, start-color…）
  center：渐变起点的位置，可以为百分比，默认是图形的正中心。
  shape：渐变的形状，ellipse表示椭圆形，circle表示圆形。
  默认为ellipse，如果元素形状为正方形的元素，则ellipse和circle显示一样。
  size：渐变的大小，即渐变到哪里停止，
  它有四个值。 closest-side：最近边； farthest-side：最远边； closest-corner：最近角； farthest-corner：最远角
  3、重复性渐变：鉴于渐变与径向渐变之间。
  1.重复性线性渐变
  列如：div { background: -webkit- repeating-linear-gradient(red, yellow 10%, green 20%); }
  2.重复性径向渐变
  列如：div { background: -webkit- repeating-radial-gradient(red, yellow 10%, green 20%); }