带背景尺寸的背景图片：封面不覆盖整个高度，具体取决于图片

Question

    .owl-page  {
         background-color: #f99904;
         position: relative;
         height: 100vh;
         width: 100%;
         margin: 0;
         background-size: cover;
         background-position: center;
         background-repeat: no-repeat;
         background-color: rgba(0,0,0,0.7);
         box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.1);
     }

为什么会这样？封面价值不是为了让你不必关心图像大小吗？

Answer 1

你可以尝试

background-size: contain

而不是

background-size: cover

。

background-size: cover

属性是为了确保它覆盖背景中的所有可用空间……但有时它不起作用。在这种情况下，我通过使用不同的

background-size

值来解决它。