CSS：如何制作不包含圖像長寬比的自適應背景圖像？

Question

我想在主體中制作一個背景圖像，而該圖像不會保持該比例的長寬比。

html,
body {
  height: 100%;
  background-image: url(../images/xmasbg13.jpg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

如果瀏覽器窗口為全屏，則上面的代碼可以正常工作。 但是，當我調整瀏覽器的大小時，它會保持圖像的長寬比，並且不會覆蓋整個頁面。

Answer 1

background-size:cover如何background-size:cover

http://jsfiddle.net/2ez1e3mn/

您可以調整結果窗格的大小，並使用它調整圖像的大小（全高和全寬）。