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

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

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

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

線性漸變

線性漸變可以沿著一個(gè)直線方向進(jìn)行顏色的過(guò)渡，通常是從上到下、從左到右或者從中心到邊緣，下面是一個(gè)使用線性漸變實(shí)現(xiàn)漸變色背景的例子：

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

在這個(gè)例子中，背景色從紅色開(kāi)始，逐漸過(guò)渡到橙色、黃色、綠色、藍(lán)色和紫色。to right表示漸變的方向是從左到右。

徑向漸變

徑向漸變則是從一個(gè)點(diǎn)或者一個(gè)圓形區(qū)域開(kāi)始，沿著半徑方向進(jìn)行顏色的過(guò)渡，下面是一個(gè)使用徑向漸變實(shí)現(xiàn)漸變色背景的例子：

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

在這個(gè)例子中，背景色從紅色開(kāi)始，逐漸過(guò)渡到橙色、黃色、綠色、藍(lán)色和紫色。circle表示漸變的形狀是一個(gè)圓形。

需要注意的是，漸變的顏色可以任意設(shè)置，可以根據(jù)需要選擇多種顏色進(jìn)行過(guò)渡，漸變的形狀和大小也可以通過(guò)設(shè)置不同的參數(shù)進(jìn)行調(diào)整。