Chrome無法檢測到自舉輪播的自動高度

Question

.carousel .carousel-inner .carousel-item img {
  width: 100%;
  height: auto;
}

.carousel .carousel-inner .carousel-item .carousel-img {
  width: 100%;
  height: 400px;
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
  background-size: cover;
  background-color: red;
}

我上面的代碼可以在調整大小時保持自舉輪播的長寬比，但不適用於Chrome。

該網頁是下一個網頁： http : //huertalia.mx/UniversidadesWP/site/index.html如果您使用Safari或Firefox進行測試並調整屏幕大小，則可以正常使用。 如果您使用鍍鉻，則傳送帶將無法正常工作。

這是輪播的html代碼

  <div style="width: 100%;" id="carouselDocumentationIndicators" class="carousel slide hidden-xs-down" data-ride="carousel">
<div class="carousel-inner" role="listbox">
  <div class="carousel-item active">
    <img class="d-block img-fluid" src="assets/img/index/carousel/1_2.jpg" alt="First slide">
    <div class="carousel-caption left-caption text-left">
      <h4 style="padding-left: 30px;" id="prof-click">SOY UNIVERSITARIO</h4>
    </div>
  </div>
  <div class="carousel-item">
    <img class="d-block img-fluid" src="assets/img/index/carousel/2_2.jpg" alt="Second slide">
    <div class="carousel-caption left-caption text-left">
      <h4 style="padding-left: 30px;" id="prof-click">SOY PROFESIONISTA</h4>
    </div>
  </div>
  <div class="carousel-item">
    <img class="d-block img-fluid" src="assets/img/index/carousel/3_2.jpg" alt="Third slide">
    <div class="carousel-caption left-caption text-left">
      <h4 style="padding-left: 30px;" id="prof-click">SOY EMPRENDEDOR</h4>
    </div>
  </div>
</div>

Answer 1

Display:flex導致移動分辨率出現問題。 我認為您可以從那里刪除高度，因為不需要，輪播會根據窗口大小調整大小。 我已附上屏幕截圖，您可以在其中查看。 讓我知道這是否對您有幫助。 我已經在chrome中測試過