CSS:如何制作排除图像宽高比的自适应背景图像?

时间:2015-12-02 04:05:04

标签: html css

我想在身体中制作一个不会保持比例纵横比的背景图像。

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

如果浏览器窗口是全屏,上面的代码可以正常工作。但是当我调整浏览器大小时,它会保持图像的宽高比,并且不会覆盖整个页面。

1 个答案:

答案 0 :(得分:0)

background-size:cover

怎么样?

http://jsfiddle.net/2ez1e3mn/

您可以调整结果窗格的大小,并使用它调整图像大小(完整高度和宽度)。