twitter-bootstrap Twitter Bootstrap Carousel 图片字幕的定位和样式
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16887484/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Positioning and styling of Twitter Bootstrap Carousel Image Captions
提问by Steve
I am trying to change the position of Carousel in the Twitter Bootstrap site. What I am trying is to bring the caption in the middle of the image (Center aligned from top and left). It is right now aligned bottom.
我正在尝试更改 Carousel 在 Twitter Bootstrap 站点中的位置。我想要的是将标题放在图像的中间（中心从顶部和左侧对齐）。它现在对齐底部。
The code is as follows:-
代码如下：-
<div id="myCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="item active" id="home-carousel-inner">
<img src="media/39440/CHI-3-4-2048x1152-v31931.jpg" alt="">
<div class="container">
<div class="carousel-caption">
<h1>Another dsdaf headline.</h1>
<p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<a class="btn btn-large btn-primary" href="#">Learn more</a>
</div>
</div>
</div>
<div class="item">
<img src="media/39468/CIH-1-2048x1152-v31931.jpg" alt="">
<div class="container">
<div class="carousel-caption">
<h1>Another example headline.</h1>
<p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<a class="btn btn-large btn-primary" href="#">Learn more</a>
</div>
</div>
</div>
<div class="item">
<img src="media/32602/CIH-2-2048x1152-1931.jpg" alt="">
<div class="container">
<div class="carousel-caption">
<h1>One more for good measure.</h1>
<p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<a class="btn btn-large btn-primary" href="#">Browse gallery</a>
</div>
</div>
</div>
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
It'd be something like this ...
它会是这样的......
Right now, it looks like this:-
现在，它看起来像这样：-
