Bootstrap change carousel height

2019-01-27 14:39发布

问题:

I have a jsfiddle here - http://jsfiddle.net/gh4Lur4b/8/

It's a full width bootstrap carousel.

I'd like to change the height and still keep it full width.

Is the height determined by the image height.

How can I chanhe the height of the carousel and keep it 100% width.

    .carousel-inner{
       // height: 300px;
    }

    .item, img{
        height: 100% !important;
        width:  100% !important;
        border: 1px solid red;
    }

回答1:

The following should work

.carousel .item {
  height: 300px;
}

.item img {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 300px;
}

JSFille for reference.



回答2:

From Bootstrap 4

.carousel-item{
    height: 200px;
} 
.carousel-item img{
    height: 200px;
}