Question

我有一个自举式刊头广告img，它在全尺寸时效果很好，但是当我缩小页面时，顶部和底部的整个〜25％都被剪掉了。在页面上的所有内容中，我希望它能够正确缩放。我尝试了width：100％，但不起作用

 padding-top: 10rem;
   padding-bottom: calc(10rem - 56px);
   background-image: url("../img/Am/20180904_094438cropped.jpg");
   background-position: center center;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;

谢谢

Answer 1

您可以尝试将代码放入容器div中。看起来可能与以下内容类似：

.container {
padding-top: 10 rem;
padding-bottom: calc(10rem - 56px);
background-image: url("../img/AM/20180904_094438cropped.jpg");
background-position: center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: 100%;
width: 100%;
}

此外，我还为您找到了以下参考资料：similar topic on stack overflow

我认为这可能会有所帮助。您的代码看起来几乎相同，但是宽度100％有点不同！看看。

引导图像被截断

1 个答案: