CSS3 渐变（Gradients）

CSS3渐变是一种在CSS中使用颜色过渡来创建阴影和光斑效果的功能。CSS3渐变可用于将镶嵌物的颜色更改为另一个颜色或将元素的颜色从顶部向底部淡入淡出。本文将详细介绍CSS3渐变的用法。

CSS3渐变的基本语法如下：

background-image: linear-gradient(direction, color-stop1, color-stop2, …);

其中，direction表示渐变的方向，可取值为to top、to bottom、to left、to right或者角度值，如45deg；color-stop1、color-stop2表示渐变开始和结束的颜色值。

比如，我们想让一个元素从上到下颜色渐变，可以使用以下代码：

background-image: linear-gradient(to bottom, #000000, #ffffff);

以上代码将会让元素从顶部向下一个颜色渐变：从黑色变成白色。如果我们想要让元素颜色渐变从左到右，可以使用以下代码：

background-image: linear-gradient(to right, #000000, #ffffff);

线性渐变带有很强的方向感，哪怕是微调方向，也会影响到视觉效果。如果我们想要让元素颜色按照从中心向外的方式渐变，可以使用径向渐变。

background-image: radial-gradient(circle at center, #000000, #ffffff);

以上代码将会让元素从中心向四周按照颜色渐变，从黑色变成白色。在径向渐变中，我们还可以自定义中心点的位置，比如：

background-image: radial-gradient(25% 25%, circle, #ff0000, #00ff00);

以上代码将会让元素从（25% 25%）这个点向四周按照颜色渐变，从红色到绿色。可以通过调整百分比来调整中心点位置。

CSS3渐变不仅可以应用于元素的背景颜色，还可以应用于字体颜色、阴影等效果。

text-shadow: 1px 1px 0 #ffffff, 2px 2px 0 #ff0000, 3px 3px 0 #00ff00, 4px 4px 0 #0000ff;
background: linear-gradient(to bottom, #ffffff, #0000ff);

以上代码将会让文本实现文字阴影，并将元素背景颜色按照从上到下的方式渐变，从白色变成蓝色。

总之，CSS3渐变是一种非常实用和兼容性良好的CSS效果，可以用于美化UI界面，并且基本上所有浏览器都支持。