在网页设计中，导航栏往往被认为是网站中最重要的一部分。通过使用渐变效果，我们可以为导航栏添加更多的吸引力和趣味性。在这篇文章中，我们将学习如何使用 CSS 代码为导航栏添加渐变效果。

nav {
background: linear-gradient(to right, #7F7FD5 0%, #86A8E7 51%, #91EAE4 100%);
}

通过上述代码段，我们可以将一个渐变的背景颜色效果应用到导航栏中。这个渐变效果会从左向右进行，颜色变化从紫色渐变到淡蓝色，接着变成浅绿色。

除了水平渐变外，我们还可以尝试垂直渐变效果：

nav {
background: linear-gradient(to bottom, #7F7FD5 0%, #86A8E7 51%, #91EAE4 100%);
}

在垂直方向上，这个渐变效果会从上向下进行，颜色变化从紫色渐变到淡蓝色，接着变成浅绿色。

如果想要添加更复杂的渐变效果，我们可以尝试使用径向渐变。这种效果可以使颜色从中心向四周逐渐变化。

nav {
background: radial-gradient(circle, #FFC5C5 0%, #FFF1C5 53%, #FFC5C5 100%);
}

在这个径向渐变效果中，颜色从中心向四周逐渐变化。从红色逐步渐变到黄色，再从黄色逐渐渐变到红色。

以上就是使用 CSS 代码为导航栏添加渐变效果的一些示例。通过这些示例，我们可以看到如何使用 CSS 代码制作出不同类型的渐变效果。在实践中可以改变颜色和方向，以获得适合自己网站的渐变效果。