css - 在 Bootstrap 轮播中扩展图像全屏/防止扩展超过视口(viewport)

Question

我正在使用最新版本的 Bootstrap 。我有一个全屏轮播，其中内容垂直居中，有 2 个问题:

1. 我无法一直扩展图像，我在我的代码中缺少一个 height:100%; 我确定它，但我不知道它应该在哪里!

   编辑: 我遇到的另一个问题是让我的 .carousel-content 类也扩展全屏(因此内容垂直居中)如果有 slider 上的固定高度，但在全屏版本中它刚好与顶部对齐

2. 我的全屏旋转木马没有考虑导航栏，因此它超出了视口(viewport)。我能够通过添加 margin-top:-121px;(我的导航/标题的高度)来解决这个问题，但这不是我喜欢的修复方法，因为 121px 的图像隐藏在标题下。

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

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

Answer 1

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

我建议你为那个 div 使用一个合适的类名，因为它没有类名。