CSS里如何讓背景漸變

在CSS中，我們可以使用線性漸變（Linear Gradients）或徑向漸變（Radial Gradients）來創(chuàng)建背景漸變效果，這兩種漸變方式都可以通過在背景屬性中設置漸變函數(shù)來實現(xiàn)。

我們來看看線性漸變，線性漸變是從一個顏色到另一個顏色的平滑過渡，我們可以通過在CSS的背景屬性中設置兩個顏色值，并使用linear-gradient函數(shù)來定義漸變的起始點和結(jié)束點，我們可以將背景設置為從紅色到藍色的線性漸變：

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

在這個例子中，漸變從紅色開始，并平滑過渡到藍色，漸變的起始點是左側(cè)，結(jié)束點是右側(cè)。

我們來看看徑向漸變，徑向漸變是從一個點向周圍擴散的漸變效果，我們可以通過在CSS的背景屬性中設置兩個顏色值，并使用radial-gradient函數(shù)來定義漸變的起始點和結(jié)束點，我們可以將背景設置為從黑色到白色的徑向漸變：

body {
  background: radial-gradient(circle, black, white);
}

在這個例子中，漸變從黑色開始，并擴散到整個背景區(qū)域，漸變的起始點是中心，結(jié)束點是整個背景區(qū)域。

需要注意的是，CSS中的漸變效果并不適用于所有瀏覽器，特別是較舊的瀏覽器版本，在使用CSS漸變時，我們需要確保目標瀏覽器支持該特性。