您當(dāng)前位置：首頁 > web前端 > htmlcss > 網(wǎng)站首頁頂部添加背景圖片的修改代碼

網(wǎng)站首頁頂部添加背景圖片的修改代碼

來源：程序員人生發(fā)布時(shí)間：2014-01-25 21:48:33 閱讀次數(shù)：2985次

　　在節(jié)日的時(shí)候，我們經(jīng)常看到一些門戶網(wǎng)站的頂部添加了大幅的網(wǎng)頁背景，還有的帶關(guān)閉功能，不但給節(jié)日添加了氣氛，而且獲得了訪客的好評(píng)。在新年就要到來之際，網(wǎng)給大家準(zhǔn)備了一些背景素材圖片及PSD文件，需要的朋友請(qǐng)到這里下載。考慮到很多朋友不會(huì)使用，于是專門整理了一篇教程，希望大家喜歡。

　　理論上說，這個(gè)教程通用于所有網(wǎng)站頂部背景的添加，換湯不換藥罷了，這里不再贅述。

　　進(jìn)入正題，首先當(dāng)然是下載素材文件。

　　第一步：

　　將您選擇的風(fēng)格圖片上傳到“你的網(wǎng)站/圖片目錄”目錄下(例如，/images/，DZ論壇的路徑一般是：/static/image/common)

　　第二步：

　　找到你網(wǎng)站的CSS文件，例如：DZ論壇的路徑是：/template/default/common/common.css中的

　　body { {BGCODE}; }

　　修改為：

　　/* body { {BGCODE}; } */

　　body { background-image: url({你的網(wǎng)站/圖片目錄/shengdan.jpg); background-position:top center; padding-top:80px;background-repeat:no-repeat; }

　　這里是以DZ論壇為例，你的網(wǎng)站則只要把上述紅色代碼添加到CSS中的任意位置就可以了，注意修改上邊藍(lán)色文字的圖片路徑哦！這樣，一般來說就完成了，如果你修改的是論壇或CMS，還需要第三步。

　　第三步