首先声明：

以下是我在做微信小程序是尝试的结果，在手机app开发中是否有差异尚未验证，欢迎留言讨论
本文先给实例再讲结论，如果小伙伴等不及可以先看最后的结论
本文所用的 方向值为（left、top、right、bottom）
透明度值越大越不透明：对透明度不熟悉或还有疑虑的小伙伴可以点此直接试一下：点击打开链接

一、需要用 透明度，rgba 写法

    1、使用 方向值，必须要 -webkit-，否则无显示
    background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.9), rgba(0,0,0,0));         // 从下到上
    background: -webkit-linear-gradient(right, rgba(0,0,0,0.9), rgba(0,0,0,0));             // 从右到左
    分别得到下图的结果：

    2、使用 deg，使用 -webkit-    
    background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.9), rgba(0,0,0,0));         // 从左向右
    background: -webkit-linear-gradient(90deg, rgba(0,0,0,0.9), rgba(0,0,0,0));         // 从下向上        

    background: -webkit-linear-gradient(180deg, rgba(0,0,0,0.9), rgba(0,0,0,0));         // 从右向左
            
    
    3、使用 deg，不使用 -webkit- 
    background: linear-gradient(0deg, rgba(0,0,0,0.9), rgba(0,0,0,0));         // 从下向上
    background: linear-gradient(90deg, rgba(0,0,0,0.9), rgba(0,0,0,0));         // 从左向右
    background: linear-gradient(180deg, rgba(0,0,0,0.9), rgba(0,0,0,0));         // 从上向下
            
    总结：
        当用 deg 时：
            加 -webkit-，0deg、90deg、180deg、270deg 分别表示 从左、下、右、上开始；

            不加-webkit-，0deg、90deg、180deg、270deg 分别表示 从下、左、上、右开始。

二、不需要 透明度，不使用 rgba，使用 #颜色值 写法

    1、使用 方向值，必须要 -webkit-，否则无显示

        background: -webkit-linear-gradient(top, #fff 0%, #000 100%);               // 从上到下
        background: -webkit-linear-gradient(right, #fff 0%, #000 100%);             // 从右到左
            
    2、使用 deg，使用 -webkit-
        background: -webkit-linear-gradient(0deg, #fff 0%, #000 100%);            // 从左到右
        background: -webkit-linear-gradient(90deg, #fff 0%, #000 100%);          // 从下到上
        background: -webkit-linear-gradient(180deg, #fff 0%, #000 100%);        // 从右到左

    3、使用 deg，不使用 -webkit-
        background: linear-gradient(0deg, #fff 0%, #000 100%);            // 从下到上
        background: linear-gradient(90deg, #fff 0%, #000 100%);          // 从左到右
        background: linear-gradient(180deg, #fff 0%, #000 100%);        // 从上到下

    总结：
        1、使用 方向值（left等），必须加 -webkit- ，方向值的意思为 从该方向开始。
              这种写法如果前面不加 -webkit- ，则无背景色显示。
        2、当第一个参数用 deg 时：
            使用 -webkit- 时，0deg、90deg、180deg、270deg，分别表示 从方向 左、下、右、上开始渐变；

            不使用 -webkit- 时，0deg、90deg、180deg、270deg，分别表示  从方向 下、左、上、右开始渐变    

综合一与二，得结论如下：

    无论使用 rgba 写法还是 #颜色值 写法：
        1、使用 方向值 时，该值表示的是 起始方向，并且必须加 -webkit-；
        2、使用 deg 时：
            1、使用 -webkit- 时，0deg、90deg、180deg、270deg，分别表示 从方向 左、下、右、上开始渐变；
            2、不使用 -webkit- 时，0deg、90deg、180deg、270deg，分别表示  从方向 下、左、上、右开始渐变；

在调试的时候感觉很多种结果，整理完了也并不复杂，希望能帮到小伙伴们！