it-swarm.com.de

Bootstrap Karussellhöhe ändern

Ich habe eine Jsfiddle hier - http://jsfiddle.net/gh4Lur4b/8/

Es ist eine volle Breite bootstrap Karussell.

Ich möchte die Höhe ändern und trotzdem die volle Breite beibehalten.

Wird die Höhe durch die Bildhöhe bestimmt.

Wie kann ich die Höhe des Karussells ändern und es 100% breit halten?.

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

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

Folgendes sollte funktionieren

.carousel .item {
  height: 300px;
}

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

JSFille als Referenz.

23
Bart Jedrocha

Von Bootstrap 4

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

Vielen Dank! Dieser Beitrag ist sehr hilfreich. Vielleicht möchten Sie auch hinzufügen

objektanpassung: Abdeckung;

Beibehaltung des Seitenverhältnisses für verschiedene Fenstergrößen

.carousel .item {
  height: 500px;
}

.item img {
    position: absolute;
    object-fit:cover;
    top: 0;
    left: 0;
    min-height: 500px;
}
3
Brandon Walton