更改傳送帶滑塊引導程序高度

我需要更改傳送帶滑塊bootstarp的高度，我已經厭倦將像素中的圖像固定高度，但它不起作用，我也厭倦了將固定高度到ID bs-carousel，但它不起作用，以及物品滑動。更改傳送帶滑塊引導程序高度

<div class="carousel fade-carousel slide" data-ride="carousel" data-interval="4000" id="bs-carousel"> 
    <!-- Overlay --> 
    <div class="overlay"></div> 
    <!-- Indicators --> 
    <ol class="carousel-indicators"> 
    <li data-target="#bs-carousel" data-slide-to="0" class="active"></li> 
    <li data-target="#bs-carousel" data-slide-to="1"></li> 
    <li data-target="#bs-carousel" data-slide-to="2"></li> 
    </ol> 
    <!-- Wrapper for slides --> 
    <div class="carousel-inner"> 
    <div class="item slides active"> 
     <div class="slide-1"></div> 
     <div class="hero"> 
     </div> 
    </div> 
    <div class="item slides"> 
     <div class="slide-2"></div> 
     <div class="hero">   
     </div> 
    </div> 
    <div class="item slides"> 
     <div class="slide-3"></div> 
     <div class="hero">   
     </div> 
    </div> 
    </div> 
</div>

這是CSS

.btn.btn-lg {padding: 10px 40px;} 
.btn.btn-hero, 
.btn.btn-hero:hover, 
.btn.btn-hero:focus { 
    color: #f5f5f5; 
    background-color: #46c3ff; 
    border-color: #46c3ff; 
    outline: none; 
    margin: 20px auto; 
} 

.fade-carousel .slides .slide-1, 
.fade-carousel .slides .slide-2, 
.fade-carousel .slides .slide-3 { 
    height: 100vh; 
    background-size: cover; 
    background-position: center center; 
    background-repeat: no-repeat; 
} 
.fade-carousel .slides .slide-1 { 
    background-image: url(http://evisax.com/img/dubai.png); 

} 
.fade-carousel .slides .slide-2 { 
    background-image: url(http://evisax.com/img/free_singapore_tour_900.jpg); 

} 
.fade-carousel .slides .slide-3 { 
    background-image: url(http://evisax.com/img/Taj_Mahal.png); 

} 

@media screen and (min-width: 980px){ 
    .hero { width: 980px; }  
} 
@media screen and (max-width: 640px){ 
    .hero h1 { font-size: 4em; }  
}

來源

2017-07-29 Sam Mohamed

使用!important改變高度

.carousel-inner{ 
    width:100%; 
    max-height: 200px !important; 
}

來源

2017-07-29 08:02:09 Bhargav

試試這個，使用PX，而不是VH以下

.fade-carousel .slides .slide-1, 
.fade-carousel .slides .slide-2, 
.fade-carousel .slides .slide-3 { 
    height: 100px; 
}

FIDDLE-DEMO

來源

2017-07-29 08:07:53

它不改變任何東西 –

只圖像已被調整，但仍滑塊100％ –

更改傳送帶滑塊引導程序高度

回答

相關問題