Javascript 猫头鹰转盘100%高度

我对猫头鹰传送带2有点问题

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

这是我网站的旧版本， 请看一下主滑块。这不是猫头鹰旋转木马，我不知道它是什么，但它工作得很好（高度设置为100%），而且它太重了

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

我把它改成了猫头鹰旋转木马，看到这个了吗 它反应灵敏，但我不能将高度设置为100%

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

JS

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

HTML

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

如果你有任何想法如何做到这一点，请与我分享。

---

提前感谢。

我用css解决了手机上的100%高度问题。

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

我知道这不是最好的解决方案，但到目前为止它仍然有效

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

.header-carousel.owl-carousel.owl-theme.owl-loaded.owl-drag,
.header-carousel .owl-stage-outer,
.header-carousel .owl-stage,
.header-carousel .owl-item,
.header-carousel .item,
.header-carousel .owl-item,
.header-carousel .img-responsive{
    height: 100vh;
    object-fit: cover;
}

---

你确定？我可以看到两个相同的，没有区别请调整浏览器的大小。已经完成，调整浏览器大小后，转盘正确调整大小（我使用的是Chrome）我也使用Chrome，但请参见：lukaszradwan.com/screen.jpg