如何使旋转滑块上的图像完美地适合浏览器（HTML）答案

【问题标题】：how to get images on revolution slider to fit perfectly onto the browser (HTML)如何使旋转滑块上的图像完美地适合浏览器（HTML）
【发布时间】：2020-12-07 19:59:38
【问题描述】：

所以我买了这个模板，想知道如何让旋转滑块上的图像完美地适合浏览器。目前，图像在顶部和底部被剪切。协助将不胜感激。提前致谢！

<div id="rev_slider_4_1" class="rev_slider fullwidthabanner" style="display:none;" data-version="5.4.7">
  <ul>

    <li data-index="rs-10" data-transition="random" data-slotamount="default" data-hideafterloop="0" 
      data-hideslideonmobile="off" data-easein="default" data-easeout="default" data- 
      masterspeed="default" data-thumb="assets/img/slider/three/100x50_slider-home2.jpg" data- 
      rotate="0" data-saveperformance="off" data-title="Slide" data-param1="" data-param2="" data- 
      param3="" data-param4="" data-param5="" data-param6="" data-param7="" data-param8="" data- 
      param9="" data-param10="" data-description="">

        <img src="assets/images/mult.jpg" alt="" data-bgposition="center 
          center" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina>
        <!-- LAYERS -->

        <!-- LAYER NR. 1 -->
                    
    </li>
  </ul>
</div>

【问题讨论】：

标签： javascript html css revolution-slider

【解决方案1】：

尝试使用object-fit的样式：

.contain {
  object-fit: contain;
}

<img src="assets/images/mult.jpg" alt="" data-bgposition="center 
          center" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg contain" data-no-retina>

阅读更多内容并查看object-fitvisit here的更多选项

【讨论】：

好吧，让我试试，让你知道进度