我正在尝试制作背景全尺寸图像为每个幻灯片幻灯片在OpenCart。正如我所看到的，OpenCart使用Swiper来创建这个滑块。以下是我的HTML的外观：
{% for banner in banners %}
<div class="swiper-slide text-center" style="background: url({{ banner.image }}); background-repeat: no-repeat; background-position: center center; background-size: cover;">
...
</div>
{% endfor %}
正如我所假设的，background-size:cover应该覆盖整个背景。但尽管如此,结果是：
看起来背景图像是试图适合在块只有顶部和底部的角。有什么我遗漏的吗？
您非常接近，但CSS属性实际上是“background-attachment:cover；”，而不是“background-size:cover；”。
这应该可以解决您调用的问题。
另一个可能有帮助的方法是使用background的速记方法，例如，不使用background:url（{{banner.image}}）；背景重复：无重复；背景-位置：中心中心；background-size：cover；
您可以使用background:#000000 url（{{banner.image}}）no-repeat cover center；
