css - Bootstrap 旋转木马 - 底部有宽幅图像的空间

Question

图片是800*450，问题出在图片上。该问题不会出现在(例如)320 × 455 图像中

这是carousel的jade代码

.col-md-12.col-xs-12
    #header-carousel.carousel.slide(data-ride="carousel", data-interval="5000")
        .carousel-inner
            each image, i in content.images
                if i === 0
                    .item.active
                    img(src="#{image}", alt="phone")
                else
                    .item
                    img(src="#{image}", alt="phone")
        a.left.carousel-control(href="#header-carousel", data-slide="prev")
            span.icon-prev
        a.right.carousel-control(href="#header-carousel", data-slide="next")
            span.icon-next

这里是自定义 CSS

.carousel-inner > .item > img,
  .carousel-inner > .item > a > img {
    width: 100%;
    margin: 0 auto;
    padding: 0px !important;
}
 .carousel-control .glyphicon-chevron-left, .carousel-control     .glyphicon-chevron-right, .carousel-control .icon-prev, .carousel-control .icon-next {
  width: 100px;
  padding: 0px !important;
  margin: 0px !important;
}

如何去除灰色部分？

Answer 1

我遇到了这个问题，尝试在图像标签中添加图像宽度和高度的属性。像这样:

 img(src="#{image}", alt="phone", width="800", height="450")