linear-gradient

1 渐变的分类：

CSS3的渐变分为两种：
线性渐变：linear-gradient；//向下/向上/向左/向右/对角方向
径向渐变：radial-gradient；//由它们的中心定义

2：linear-gradient

/从元素顶部有条阴影，两种方式，第二种更好，能控制阴影的宽度/
background-image: linear-gradient(0deg, rgba(226, 226, 226, 0) 97%, rgba(0, 0, 0, 0.04) 100%);
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.04) 0px, rgba(226, 226, 226, 0) 12px);
用角度值指定渐变的方向（或角度）。
设置渐变为从右到左。相当于: 270deg
设置渐变从左到右。相当于: 90deg
设置渐变从下到上。相当于: 0deg
设置渐变从上到下。相当于: 180deg。这是默认值，等同于留空不写。

3：radial-gradient

默认情况下，渐变的中心是 center（表示在中心点）。
渐变的形状是 ellipse（表示椭圆形）。
渐变的大小是 farthest-corner（表示到最远的角落）。

background: radial-gradient(ellipse,red,yellow,green);
background: radial-gradient(circle,red,yellow,green);

转自： https://blog.csdn.net/tel13259437538/article/details/79353449