Question

我正在尝试拉伸图像以适应整个背景，到目前为止，我已尝试过这段代码，但它只是垂直重复，我不想要。

body {
    margin: 0;
    border: 0;
    background-image: url(/images/bg.jpg);
    background-size: cover;
    background-position: center;
}

Answer 1

尝试使用

background-image: url("/images/bg.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
background-size: cover;

可以缩写为

background: url("/images/bg.jpg") no-repeat fixed center;
background-size: cover;

Answer 2

使用此功能，同时请确保将您的路径括在引号''中：

background-repeat: no-repeat

为了将来参考，您可以组合大多数背景属性，如下所示：

型号：

background: <background-color> | <background-image> | <background-repeat> | <background-attachment> | <background-position>

你的CSS：

body {
    margin: 0;
    border: 0;
    background-size: cover;
    background: url('/images/bg.jpg') no-repeat fixed center;
}

更多信息：http://www.htmlgoodies.com/beyond/css/article.php/3868361

伸展以适应CSS中的背景

2 个答案: