スライドショーを画面に合わせる

Question

私はブートストラップを使ってフロントエンドのウェブサイトを開発しています。スライドショーを挿入しましたが、画面に合わない。 CSSにではなく、HTMLにイメージを挿入しました。ここに私のコード：

<div class="container-fluid" id="background"> 
     <div class="row"> 
      <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="slideShow"> 
       <div id="myCarousel" class="carousel slide" data-ride="carousel"> 
        <!-- Indicators --> 
        <ol class="carousel-indicators"> 
         <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
         <li data-target="#myCarousel" data-slide-to="1"></li> 
         <li data-target="#myCarousel" data-slide-to="2"></li> 
         <li data-target="#myCarousel" data-slide-to="3"></li> 
         <li data-target="#myCarousel" data-slide-to="4"></li> 

        </ol> 

        <!-- Wrapper for slides --> 
        <div class="carousel-inner" role="listbox"> 
         <div class="item active"> 
          <img src="pics/happiness1.jpg" alt="Happiness" class="slideShow"> 
         </div> 

         <div class="item"> 
          <img src="pics/happiness2.jpg" alt="Happiness" class="slideShow"> 
         </div> 

         <div class="item"> 
          <img src="pics/happiness3.jpg" alt="Happiness" class="slideShow"> 
         </div> 

         <div class="item"> 
          <img src="pics/happiness4.jpg" alt="Happiness" class="slideShow"> 
         </div> 

         <div class="item"> 
          <img src="pics/happiness5.jpg" alt="Happiness" class="slideShow"> 
         </div> 
        </div> 

        <!-- Left and right controls --> 
        <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev"> 
         <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> 
         <span class="sr-only">Previous</span> 
        </a> 
        <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next"> 
         <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> 
         <span class="sr-only">Next</span> 
        </a> 
       </div> 

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

どのようにそれらのイメージを画面に合わせるには？

Answer 1

CSSファイルのこの最後のを追加します。..

.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img{ 
    min-height: 100vh; 
}