Bootstrap 3轮播图像不适合整个屏幕以及如何定位文本？答案

【问题标题】：Bootstrap 3 carousel image won't fit the whole screen and how to position the text?Bootstrap 3轮播图像不适合整个屏幕以及如何定位文本？
【发布时间】：2014-07-19 03:08:46
【问题描述】：

我是 bootstrap 的新手，而且对编码的时间不长。

我在引导程序中创建了一个轮播，但图像位于中间。但我希望它遍布整个旋转木马。我该如何解决？

我希望上面的文字出现在左侧的图片上。我怎样才能做到这一点？我尝试使用 text-align ，但也许我在错误的行上做了。

<div class="row dnd_bottomspace">
<div class="col-md-12">         
    <div id="myCarousel" class="carousel slide"  data-ride="carousel">
        <!-- 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>
        </ol>   
       <!-- Carousel items -->
        <div class="carousel-inner">
            <div class="active item">
                <h2>Slide 1</h2>
                <div class="carousel-caption">
                    <img src="Materialien/erde.jpg" class="img-responsive">
                  <h3>Erster Slider</h3>
                  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                </div>
            </div>
            <div class="item">
                <h2>Slide 2</h2>
                <div class="carousel-caption">
                    <img src="Materialien/erde.jpg" class="img-responsive">
                    <h3>Zweiter Slider</h3>
                    <p>Aliquam sit amet gravida nibh, facilisis gravida odio.</p>
                </div>
            </div>
            <div class="item">
                <h2>Slide 3</h2>
                <div class="carousel-caption">
                    <img src="Materialien/erde.jpg" class="img-responsive">
                    <h3>Dritter Slider</h3>
                    <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>
                </div>
            </div>
            <div class="item">
                <h2>Slide 4</h2>
                <div class="carousel-caption">
                    <img src="Materialien/erde.jpg" class="img-responsive">
                    <h3>Vierter Slider</h3>
                    <p>Aliquam sit amet gravida nibh, facilisis gravida odio.</p>
                </div>
            </div>
        </div>
    </div>
</div>

【问题讨论】：

标签： image text twitter-bootstrap-3 carousel

【解决方案1】：

这部分应该进入 class="item"

<img src="Materialien/erde.jpg" class="img-responsive">

任何描述图片或其他内容的文字都应放入 class="carousel-caption"。

如果您希望文本位于左侧，则

<div class="carousel-caption" style="text-align:left;">

【讨论】：