css动画学习-初识 渐变

实现：background-image：linear-gradient()

方法使用 background-image 的 linear-gradient 方法

三色渐变：

background-image: linear-gradient(pink,#fff,#000);

透明渐变效果

(transparent,#000); 从透明到#000

background-image: linear-gradient(transparent, #000);

控制渐变方向

默认从上向下渐变 to bottom ，to 就是渐变方向从哪里开始

linear-gradient(to bottom, transparent, #000);

同等于 linear-gradient(transparent, #000);

/* 渐变从左开始 */
background-image: linear-gradient(to left, red , blue);

提醒：平时可根据需要，配合透明属性 opacity 达到一种颜色比较浅的渐变效果