圖像和輪播不響應 bootstrap5.2

Question

我有反應問題。 當我在手機上打開我的網站時，我放在<i class="img-fluid material-icons">標簽中的圖標圖像會消失，而它們在計算機上是可見的。 我試圖從引導程序添加 img-fluid 但它不起作用我不明白為什么。 在此鏈接上，您可以看到完整https://jsfiddle.net/z3hx2Lcr的所有代碼，在此鏈接中您可以看到結果https://testportfolio111.000webhostapp.com/我也有一個響應問題里面的文字效果。 當我在手機上打開網站時，輪播出現故障，我試圖解決這個問題，但我做不到。 誰能給我解決方案？

Answer 1

您的底部有問題，帶有 class.skills-bar 的元素會破壞頁面並導致右側出現間隙，因為它具有固定的寬度值，因此將其更改為此代碼

.skills-bar {
  width: 100%;
  max-width: 600px;
}

並在您的圖標所在的容器中將其更改為移動版本而不是

<div class="col animationtextinleft"></div>
<div class="col"></div>
<div class="col animationtextinright"></div>

用這個

<div class="col-12 animationtextinleft"></div>
<div class="col-12"></div>
<div class="col-12 animationtextinright"></div>

關於您的 slider: your.carousel-item has height: 100vh 將其更改為 height: auto 在移動版本中，其文本未顯示的原因是這些幻燈片（carousel-caption）獲取 class d-none