我正在开发一个基于 Bootstrap 的新网站，并且正在使用默认的 Bootstrap 轮播。我让它运行完美，但希望将图像幻灯片修改为全宽但保持固定高度（必要时裁剪）。
同时，我想将控件（左/右和点指示器）和标题保留在容器内，使其与正文内容对齐。我试过简单地将控制代码放入 a<div class="container"></div>以及 row 和 span div 中。然而，什么都行不通。或者，我可以通过在使控件全宽的同时包含图像来做相反的事情。
有没有一种快速简便的方法来做到这一点？这是我的轮播的代码块：
<div id="home-carousel" class="carousel slide">
<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item">
<img src="img/carousel-1.jpg">
<a href="#"><div class="carousel-caption">
<p class="carousel-title">This is the caption.</p>
<p class="hidden-phone">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin mauris ligula, ultrices accumsan imperdiet eu, convallis in nunc. Nam commodo augue a libero vestibulum sed convallis enim mattis.</p>
</div></a>
</div>
<div class="item">
<img src="img/carousel-2.jpg">
<a href="#"><div class="carousel-caption">
<p class="carousel-title">I'm a caption, too!</p>
<p class="hidden-phone">Lorem ipsum dolor sit amet, c</p>
</div></a>
</div>
<div class="item">
<img src="img/carousel-3.jpg">
<a href="#"><div class="carousel-caption">
<p class="carousel-title">Yeah, me too.</p>
<p class="hidden-phone">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin mauris ligula, ultrices accumsan imperdiet eu, convallis in nunc. Nam commodo augue a libero vestibulum sed convallis enim mattis.</p>
</div></a>
</div>
</div>
<!-- Carousel nav -->
<ol class="carousel-indicators">
<li data-target="#home-carousel" data-slide-to="0" class="active"></li>
<li data-target="#home-carousel" data-slide-to="1"></li>
<li data-target="#home-carousel" data-slide-to="2"></li>
</ol>
<a class="carousel-control" href="#home-carousel" data-slide="prev"><i class="icon-chevron-left"></i></a>
<a class="carousel-control right" href="#home-carousel" data-slide="next"><i class="icon-chevron-right"></i></a>
任何帮助将不胜感激！