自定义转盘自举3

Question

我想自定义此模板的转盘http://startbootstrap.com/templates/modern-business/ 我需要插入标准的引导3容器类里面的旋转木马：

.container { 
padding-right: 15px; 
padding-left: 15px; 
margin-right: auto; 
margin-left: auto; 
} 

的问题是，如果我进入转盘这个类里面，它消失了，什么都看不到......

这是旋转木马的代码：

<div id="myCarousel" class="carousel slide"> 
    <!-- 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> 
    </ol> 

    <!-- Wrapper for slides --> 
    <div class="carousel-inner"> 
     <div class="item active"> 
     <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=Slide One');"></div> 
     <div class="carousel-caption"> 
      <h1>Modern Business - A Bootstrap 3 Template</h1> 
     </div> 
     </div> 
     <div class="item"> 
     <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=Slide Two');"></div> 
     <div class="carousel-caption"> 
      <h1>Ready to Style &amp; Add Content</h1> 
     </div> 
     </div> 
     <div class="item"> 
     <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=Slide Three');"></div> 
     <div class="carousel-caption"> 
      <h1>Additional Layout Options at <a href="http://startbootstrap.com">http://startbootstrap.com</a></h1> 
     </div> 
     </div> 
    </div> 

    <!-- Controls --> 
    <a class="left carousel-control" href="#myCarousel" data-slide="prev"> 
     <span class="icon-prev"></span> 
    </a> 
    <a class="right carousel-control" href="#myCarousel" data-slide="next"> 
     <span class="icon-next"></span> 
    </a> 
</div> 

我该如何解决这个问题？由于

Answer 1

如果您检查模板，你会看到自定义的CSS中定义：

http://startbootstrap.com/templates/modern-business/css/modern-business.css

有些款式使转盘等多个集装箱100％的高度和宽度。您可以添加一些CSS替代来达到同样的影响：

html,body { 
    height:100%; 
} 

.carousel-inner,.carousel,.item,.container,.fill { 
    height:100%; 
    width:100%; 
} 

演示：http://www.bootply.com/89646