CSS頁面背景圖片漸變設(shè)置

在CSS中，我們可以使用線性漸變（Linear Gradient）或者徑向漸變（Radial Gradient）來設(shè)置頁面背景圖片的漸變效果。

我們來看一下線性漸變，線性漸變可以沿著一個直線方向進行顏色的過渡，通常是從上到下或者從左到右，我們可以通過設(shè)置兩個或多個顏色點來定義漸變的起始和結(jié)束顏色，我們可以將背景圖片設(shè)置為從藍色到紅色的漸變：

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

在這個例子中，linear-gradient函數(shù)接受兩個參數(shù)：漸變的起始方向（to right）和漸變的起始顏色（blue）和結(jié)束顏色（red）。

我們來看一下徑向漸變，徑向漸變是從一個點開始，沿著半徑方向進行顏色的過渡，通常是從中心到邊緣，同樣地，我們可以設(shè)置兩個或多個顏色點來定義漸變的起始和結(jié)束顏色，我們可以將背景圖片設(shè)置為從黃色到藍色的徑向漸變：

body {
  background: radial-gradient(circle, yellow, blue);
}

在這個例子中，radial-gradient函數(shù)接受兩個參數(shù)：漸變的形狀（circle）和漸變的起始顏色（yellow）和結(jié)束顏色（blue）。

需要注意的是，這些漸變效果在CSS中的兼容性可能因瀏覽器而異，在使用之前，***好先檢查你的目標瀏覽器是否支持這些特性，如果不支持，你可能需要使用其他方法來實現(xiàn)類似的視覺效果。