在 bootstrap 轮播中扩展图像全屏/防止扩展超过视口

Question

我使用的是最新版本的bootstrap。我有一个全屏旋转木马，里面有垂直居中的内容，2 个问题：

1. 我无法一直扩展图像，我在我的代码中某处遗漏了一个 height:100%; 我确定它，但我无法弄清楚它应该在哪里！

   编辑： 我遇到的另一个问题是让我的 .carousel-content class 也扩展全屏（因此内容垂直居中）这有效如果滑块上有固定高度，但在全屏版本中它刚好与顶部对齐

2. 我的全屏轮播没有考虑导航栏，所以它超出了视口。我可以通过添加 margin-top:-121px;（我的 nav/header 的高度）来解决这个问题，但这不是我喜欢的修复方法，因为图像的 121px 隐藏在 header 下。

已更新 fiddle：http://jsfiddle.net/bwupc7g6/1/

我相信这对其他用户也有帮助，如果有人可以看的话。

Answer 1

.carousel-inner .item div {
  height:100%;
}

我建议您为 div 使用一个合适的 class 名称，因为它没有名称。