Question

我想要整个宽度的背景图像。我有CSS代码如下。

background: url(../images/img.png) 50% 50% no-repeat; -webkit-background-size: auto 100%; background-size: auto 100%;

但是这个代码图像有两边的边距。当然，我在身体标签上做了保证金：0。谢谢你的帮助！

Answer 1

您可以使用以下css。

 body, html {
        height: 100%;
    }

    .bg { 
        /* The image used */
        background-image: url(../images/img.png);

        /* Full height */
        height: 100%; 

        /* Center and scale the image nicely */
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

Answer 2

您正在使用50% 50%开始背景，这有点奇怪。所以你要做的就是使用background-size: cover;并确保你提供no-repeat：

＆＃13;

body {background: url("https://images.unsplash.com/photo-1489844097929-c8d5b91c456e?dpr=1&auto=format&fit=crop&w=1500&h=998&q=80&cs=tinysrgb&crop=") no-repeat; background-size: cover;}

＆＃13;

使背景图像全宽

2 个答案: