我如何让 img-fluid 在 Bootstrap Carousel 中工作？答案

【问题标题】：How do i get img-fluid to work in Bootstrap Carousel?我如何让 img-fluid 在 Bootstrap Carousel 中工作？
【发布时间】：2020-12-16 11:59:14
【问题描述】：

我一直在尝试通过向它们添加 img-fluid 标签来使我的轮播中的图像具有响应性，但没有任何效果。我试过使用！important。我试过使用块。我不确定是什么阻止了这种变化。有什么建议吗？

.container{
        
        font-size: 32px;
        font-family: 'Inter', sans-serif;
        position:relative;
        top: 150px;
        right:-15px;
        font-weight: 300;
        width: 1440px;
        letter-spacing: 2px;
        
      
  }
  
 
  
  .item{
      
      
        float:right;
      
     
      
  }
  


<div class="container">

<div class="carousel-inner">
  <div class="item active">
    <img class="image img-fluid" src="images/image-tanya.jpg" alt="Tanya" style="height:648px; width:648px;" ><div class="carousel-caption">  
  </div>
    </div>      

  <div class="item ">
    <img class="image img-fluid" src="images/image-john.jpg" alt="John" style="height:648px; width:648px;">
  </div>

【问题讨论】：

标签： javascript html css bootstrap-4

【解决方案1】：

style="height:648px; width:648px;" 是罪魁祸首

img-fluid 类定义的样式被 HTML 中 img 标记上的内联样式覆盖。内联样式始终优先于样式表中定义的样式。尝试删除那些内联样式，看看会发生什么:)

【讨论】：