CSS拉伸或适合背景图像

Question

我想使用css拉伸或调整我的背景图像，因此无论屏幕大小如何，它总是在宽度和高度的100％。 这被问了很多次，每个人都建议使用背景大小：100％，它会工作。 但使用背景大小只适合我的图像宽度，高度仍然被裁剪。
如果有人可以帮助我，我将不胜感激。
非常多

Answer 1

编辑：

你试过background-size: 100% ，
CSS将此解释为100% width, automatic height ，如下所示：

background-size: 100% auto;

你想要的是第二个参数（高度）也是100％，所以你应该这样做：

background-size: 100% 100%;

结束编辑

尝试：

background-size: cover;

这将适合宽度或高度，并溢出其余部分

要么：

background-size: contain;

这将使图像尽可能大，而不会改变它的纵横比。

您可以在这里阅读有关css3 background-size属性的更多信息

Answer 2

你可以试试：

background: url('Your image URL') 100%;

要么

background: url('Your image URL') 100% no-repeat;

Answer 3

试试这个CSS规则：

background-repeat: no-repeat;
background-attachment: scroll;
background-position: center center
background-size: cover; // this makes img full-screen (full-width & full-height)