定影旋轉木馬容器大小

Question

我使用Angular-UI-Bootstrap我的項目。在旋轉木馬中，我必須加載不同尺寸的圖像，其中一些較大，一些比容器小。我怎樣才能確定轉盤容器的大小，以便轉盤不會在每次加載新圖像時調整大小，而加載的圖像可以放入容器並保持其原始比例？

<div style="height:305px;"> 
    <carousel interval="carousel_interval"> 
     <slide ng-repeat="slide in slides" active="slide.active"> 
      <img ng-src="{{slide.image}}"> 
      <div class="carousel-caption"> 
       <h4>Slide {{$index}}</h4> 
       <p>{{slide.text}}</p> 
      </div> 
     </slide> 
    </carousel> 
</div> 

目前，我使用從Angular-UI-Bootstrap carousel section的樣本中提取的代碼。它不起作用，因爲我正在加載各種尺寸的圖像。

代碼是在谷歌的Chrome版本38.0.2125.122米測試。

Answer 1

<div class="col-md-6"> 
    <carousel interval="carousel_interval"> 
     <slide ng-repeat="slide in slides" active="slide.active"> 
      <img ng-src="{{slide.image}}" style="max-height:300px; margin:0 auto;"> 
      <div class="carousel-caption"> 
       <h4>Slide {{$index}}</h4> 
       <p>{{slide.text}}</p> 
      </div> 
     </slide> 
    </carousel> 
</div> 

我在最上面的元件div使用col-md-6和施加style="max-height:300px; margin:0 auto;"到img元件。

現在，不同尺寸的圖像可以放入傳送帶非常好。