根據div的寬度和高度來縮放背景圖片CSS

Question

有沒有什麼辦法根據div的寬度和高度來縮放背景圖片？只使用CSS。

Answer 1

我使用background-size: cover爲我的全尺寸bg圖像。如果你不喜歡那個結果，可以設置一個圖像在div內部並給予以下任一：容器的

全寬度，保持縱橫比：

width : 100%; 
height : auto; 
position : absolute; 
z-index : 0; /* something lower than content */ 

容器的全高，維持縱橫比：

width : auto; 
height : 100%; 
position : absolute; 
z-index : 0; /* something lower than content */ 

全寬和容器的高度，將翹曲&拉伸：

width : 100%; 
height : 100%; 
position : absolute; 
z-index : 0; /* something lower than content */