<div background拉伸是一種CSS技術，可以將背景圖片以拉伸的方式填充整個容器，不管容器的大小如何變化，背景圖片都會自動進行拉伸，以達到完美適應的效果。這種技術特別適用于需要動態調整大小的容器，比如響應式網頁設計中的背景圖片。
要實現div background拉伸，我們需要使用CSS的background-size屬性。這個屬性規定背景圖片的大小，可以指定具體的寬度和高度值，也可以使用特定的關鍵字。其中，"cover"關鍵字會拉伸背景圖片以填充整個容器，完全不留空白區域；"contain"關鍵字會拉伸背景圖片以完全適應容器，但可能會留下一些空白區域。
下面是幾個用代碼案例來詳細解釋說明div background拉伸的例子：
案例一： 假設我們有一個div容器，寬度為200像素，高度為100像素，背景圖片為一幅寬度為400像素，高度為200像素的圖片。我們想要使背景圖片完全適應div容器的大小，可以使用以下代碼：

.container {
width: 200px;
height: 100px;
background-image: url("background.jpg");
background-size: contain;
}

在這個案例中，我們通過設置background-size為contain，使得背景圖片被拉伸以適應整個div容器，但可能會在容器的兩側和頂部底部留下一些空白區域。
案例二： 現在，我們希望背景圖片不留下任何空白區域，同時填充整個div容器。可以使用以下代碼來實現：

.container {
width: 200px;
height: 100px;
background-image: url("background.jpg");
background-size: cover;
}

在這個案例中，通過設置background-size為cover，背景圖片會被拉伸以填滿整個div容器，不留下任何空白區域。這樣無論div容器的大小如何變化，背景圖片都會自動適應。
案例三： 在響應式網頁設計中，我們經常會遇到需要根據屏幕尺寸和方向動態調整背景圖片大小的需求。可以使用媒體查詢和不同的background-size屬性值來實現這一功能。以下是一個簡單的示例：

.container {
background-image: url("background.jpg");
background-size: cover;
}
<br>
    @media screen and (max-width: 600px) {
.container {
background-size: contain;
}
}

在這個案例中，我們通過媒體查詢指定了當屏幕寬度小于600像素時，div容器的背景圖片使用contain來縮放，以保證圖片完全顯示在屏幕上。而當屏幕寬度大于600像素時，背景圖片將使用cover來填充整個div容器。
通過這樣靈活運用div background拉伸的技術，我們可以輕松實現背景圖片的拉伸，適應各種容器大小和屏幕尺寸，從而優化網頁的顯示效果。