css3实现背景色渐变linear-gradient()

用线性渐变创建图像。

• 如果想创建以对角线方式渐变的图像，可以使用 to top left 这样的多关键字方式来实现。

• 示例代码：
      linear-gradient(#fff, #333);
  linear-gradient(to bottom, #fff, #333);
  linear-gradient(to top, #333, #fff);
  linear-gradient(180deg, #fff, #333);
  linear-gradient(to bottom, #fff 0%, #333 100%);
  

   

• demo代码：

  • 　　

• 　运行结果

• 

   其中  background: linear-gradient(to right,#FFB95E ,#F35C70);  直接是两种颜色的过度效果，运行结果如下图所示：
  

   

   如果使用 background: -webkit-linear-gradient(to right,#FFB95E 15%,#FCA661 5%,#FCA362 5%,#FA8F66 25%,#F5736B 20%,#F35C70 30%);实现页面的过度，则效果如下
  

   

  
   

转载于:https://www.cnblogs.com/lvxisha/p/9775255.html