css - 图像未显示在 Bootstrap 3 轮播中

Question

我将 Bootstrap 用于图像轮播。我在轮播中有 1 张图片，但图片没有显示(它的大小被设置为 0x0，而使用 Chrome 开发者工具时自然大小是正确的)。

.imageSection {
  position: relative;
  display: inline-block;
  margin:0 auto;
  background: red;
  padding: 0px;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="imageSection">
      <div class="carousel slide" id="imageCarousel" data-interval="false">
        <div class="carousel-inner">
          <div class="item"><img src="http://www.clker.com/cliparts/r/0/O/0/X/O/image-of-person-sspeck-hi.png">
          </div>
        </div>
      </div>
</div>

我很确定我错过了什么。感谢对此的任何帮助!

Answer 1

您需要添加 active恰好一件 <div class="item active">

来自引导文档 http://getbootstrap.com/javascript/#carousel

Initial active element required The .active class needs to be added to one of the slides. Otherwise, the carousel will not be visible.