渐变效果

·线性渐变：

属性：linear-gradinet（开始位置 角度，起始颜色，终止颜色 位置）

·开始位置：渐变开始的位置，属性值可以为百分比/长度/left、right、top、botton（可 组合使用）

·重复渐变将属性修改为：repeating-linear-gradinet()

·径向渐变：

属性：radial-gradinet()（开始位置 角度，起始颜色，终止颜色）

·形状：ellipse（椭圆）/circle（圆形）

·发散方向：left、right、top、botton、center（可组合使用）

·大小（半径）：属性值可以用像素或关键字表示

·closest-side：圆心到距离最近的边。

·farthest-side：圆心到距离最远的边。

·closest-corner：圆心到距离最近的角。

·farthest-corner：圆心到距离最远的角。

·重复到径向渐变：repeating-radial-gradinet()。

如：background:radial-gradinet(circle,red,blue,orange)

background:radial-gradinet(circle at top right,red,blue,orange)

background:radial-gradinet(circle 50px,red,blue,orange)

background:radial-gradinet(circle closest-side,red,blue,orange)

background:repeating-radial-gradinet(circle 50px,red,blue,orange)