我們在thml,創建一個div.并將這個div的背景設置為圖片，當然，如果您需要將圖片作為整個頁面的背景，以下步驟也同樣適用與您。

在上圖中，有幾個div，我們以id為d1的div為例。

創建了div后，我們需要為div添加樣式。添加樣式我們全部寫在CSS文件中，并在html頁面中引用。

具體的樣式入下圖所示：

我們首先使用了一張為regist.png的圖片作為背景，將其設置為背景。將圖片作為背景的具體代碼入下圖所示。

如果我們的背景小于我們的頁面，而頁面沒有固定寬度的話，那么圖片背景就會產生平鋪，我們需要設置不讓其自動平鋪。

利用可以對您的圖片進行等比例擴大，當然也可以拉伸，拉伸會失真，這不是明智的做法。不過等比例獲得您也會失去一部分圖片。具體效果您可以試一試看。

裁剪溢出部分。

如果您的div已經有了需要占滿全屏，您的div的寬度可以設置為100%,這樣您的div會隨您的頁面改變其尺寸，但對于我們具體的業務div的寬度與高度根據您的需要進行設置即可。

如果您的div需要居中，您可以設置margrin:0auto即可。

如果您還處與學習階段，局部您可以在開發的過程中，不斷調整，最后調整出您所需要的效果。

CSS中，您可以使用顏色作為頁面的背景進行處理，當然處此之外，您還可以將背景設置為圖片，接下來，我為您介紹如何使用圖片作為背景，并對其進行處理。

工具/原料

html

css

方法/步驟

1、我們在thml,創建一個div.并將這個div的背景設置為圖片，當然，如果您需要將圖片作為整個頁面的背景，以下步驟也同樣適用與您。

2、在上圖中，有幾個div，我們以id為d1的div為例。

3、創建了div后，我們需要為div添加樣式。添加樣式我們全部寫在CSS文件中，并在html頁面中引用。

4、具體的樣式入下圖所示。

5、我們首先使用了一張為regist.png的圖片作為背景，將其設置為背景。將圖片作為背景的具體代碼入下圖所示。

6、如果我們的背景小于我們的頁面，而頁面沒有固定寬度的話，那么圖片背景就會產生平鋪，我們需要設置不讓其自動平鋪。

7、利用可以對您的圖片進行等比例擴大，當然也可以拉伸，拉伸會失真，這不是明智的做法。不過等比例獲得您也會失去一部分圖片。具體效果您可以試一試看。

8、裁剪溢出部分。

9、如果您的div已經有了需要占滿全屏，您的div的寬度可以設置為100%,這樣您的div會隨您的頁面改變其尺寸，但對于我們具體的業務div的寬度與高度根據您的需要進行設置即可。

10、如果您的div需要居中，您可以設置margrin:0auto即可。