Hi，大家好，我是编程小6，很荣幸遇见你，我把这些年在开发过程中遇到的问题或想法写出来，今天说一说Html中背景色之颜色渐变[通俗易懂],希望能够帮助你!!!。

颜色渐变:

  原理:以水平中心开始顺时针画圆

    1.颜色渐变分为水平渐变与放射性渐变

   
线性渐变：

      写法一：background：liner-gradient(red,black)【表示颜色从上往下，从红到绿转换，各占50% （默认）】

      写法二：liner-gradient(to right,red，green)【表示颜色的渐变方向（也是九宫格）】

      写法三：background:liner-gradient(45deg,red,black)【表示中中间的水平线顺时针旋转10度开始渐变】

     写法四：background：liner-gradient(red 20%,black 30%，pink)【表示颜色渐变所占的百分比】

     写法五:复合写法background:liner-gradient(to top right,red 20%,blact 30%,pink)【表示颜色从右下角往左上角，从红色开始渐变到20%,在由绿色从20%渐变到30%,剩下的都是粉红色】

     颜色渐变方向有:to bottom、to top、to left、to right、to top right、to top left、to bottom left、to bottom right【其实就是一个四边形的四条边与四个角】

   
放射性渐变：【默认以椭圆为中心向四周扩散】

      写法：background:radial-gradient(orange,black)【写法与线性渐变相似】

        写法二：radial-gradient( circle 100px at center center, orange,black)【 改变放射源的形状为圆，圆心坐标在中心center center,半径为100px(可不写)】