使用漸變色的背景圖可以給網頁增加獨特的風味，制作方法簡單，只需要使用CSS代碼即可。

首先，需要使用background-image屬性引入圖片，然后使用linear-gradient屬性定義漸變，代碼如下：

background-image: linear-gradient(to bottom, rgba(0,0,0,0.8), rgba(0,0,0,0.3)), url(圖片路徑);

這段代碼中，to bottom表示漸變方向為從上到下，rgba(0,0,0,0.8)和rgba(0,0,0,0.3)分別表示漸變色，在本例中為黑色。圖片路徑中的url()表示圖片路徑，可以根據實際情況填寫。

此外，還可以使用radial-gradient屬性定義徑向漸變，代碼如下：

background-image: radial-gradient(ellipse at center top, rgba(0,0,0,0.8), rgba(0,0,0,0.3)), url(圖片路徑);

這段代碼中，ellipse表示橢圓形，at center top表示漸變中心為居中頂部，其余屬性與linear-gradient相同。

通過以上方法，可以輕松制作出具有漸變效果的背景圖，為網頁增添活力與美感。