垂直中心Bootstrap旋轉木馬圖像標題

Question

是否可以將標題置於Bootstrap 3.0垂直居中？

下面是現在的樣子http://i.imgur.com/OJKaXwv.png

這樣的標題，所有的文字，是在畫面中間的屏幕截圖？這裏是我的HTML代碼：

<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> 
    <div class="carousel-inner"> 
    <div class="item active"> 
     <img src="images/slide01.jpg" alt="First slide"> 
     <div class="carousel-caption"> 
      <h1>Welcome</h1> 
      <p>Here you'll see a great text!</p> 
     </div> 
    </div> 
    <div class="item"> 
     <img src="images/slide02.jpg" alt="Second slide"> 
     <div class="container"> 
     <div class="carousel-caption"> 
      <h1>Great Caption</h1> 
      <p>So, this will be a great text as well.</p> 
     </div> 
     </div> 
    </div> 
    <div class="item"> 
     <img src="images/slide03.jpg" alt="Third slide"> 
     <div class="container"> 
     <div class="carousel-caption"> 
      <h1>One more</h1> 
      <p>Once again you'll see a great text here, seriously it'll be awesome!</p> 
     </div> 
     </div> 
    </div> 
    </div> 
    <a class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a> 
    <a class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a> 
</div> 

我的CSS文件漂亮股（什麼都沒有改變）：

.carousel { 
    margin-bottom: 60px; 
/* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */ 
    margin-top: -20px; 
} 

/* Since positioning the image, we need to help out the caption */ 
.carousel-caption { 
    z-index: 10; 
} 

/* Declare heights because of positioning of img element */ 
.carousel .item { 
    min-height: 200px; 
    background-color: #777; 
} 
.carousel-inner > .item > img { 
    width: 100%; 
    display: block; 
    max-width: 100%; 
} 

我不能得到這個工作，已經嘗試過：http://stackoverflow.com/questions/16887484/positioning-and-styling-of-twitter-bootstrap-carousel-image-captions/19623418#19623418 , http://stackoverflow.com/questions/19070256/center-content-vertically-in-bootstrap3-carousel-with-flexbox , http://philipwalton.github.io/solved-by-flexbox/demos/vertical-centering/ , http://jsfiddle.net/pYjnF/1/

的無他們工作，他們根本沒有中心的說明。

我現在正忙於集中文本，並以某種方式給人感覺令人尷尬的容易，但我無法弄清楚如何去做。

Answer 1

嘗試在你的CSS添加以下代碼：

.carousel-caption { 
    margin-bottom: 50px; 
} 

變化，根據您的圖片大小像素值。