本文目錄導(dǎo)讀：

1. 線性漸變
2. 徑向漸變

CSS實(shí)現(xiàn)背景色漸變效果的方法

在CSS中，我們可以使用線性漸變（Linear Gradient）或徑向漸變（Radial Gradient）來實(shí)現(xiàn)背景色的漸變效果。

線性漸變

線性漸變是指顏色沿著一條直線進(jìn)行變化，通常是從一個(gè)顏色過渡到另一個(gè)顏色，我們可以通過設(shè)置background屬性中的linear-gradient函數(shù)來實(shí)現(xiàn)。

body {
  background: linear-gradient(to right, red, orange, yellow, green, blue, purple);
}

上述代碼會將背景色從紅色漸變?yōu)樽仙?，顏色變化的方向是從左到右?/p>

徑向漸變

徑向漸變是指顏色沿著一個(gè)圓形或橢圓形的路徑進(jìn)行變化，通常是從中心向外擴(kuò)散，我們可以通過設(shè)置background屬性中的radial-gradient函數(shù)來實(shí)現(xiàn)。

body {
  background: radial-gradient(circle, red, orange, yellow, green, blue, purple);
}

上述代碼會將背景色從紅色漸變?yōu)樽仙?，顏色變化的方向是從中心向外擴(kuò)散。

需要注意的是，漸變的顏色數(shù)量和順序可以根據(jù)需要進(jìn)行調(diào)整，以實(shí)現(xiàn)不同的漸變效果，還可以設(shè)置漸變的起始角度、終止角度等屬性，以進(jìn)一步控制漸變的形狀和方向。