2017-01-16 95 views

回答

7

這是在引導4阿爾法6一個已知的問題...

https://github.com/twbs/bootstrap/issues/21611

作爲解決方法你可以使用..

.carousel-item.active, 
.carousel-item-next, 
.carousel-item-prev { 
    display: block; 
} 

http://www.codeply.com/go/0QUU06MiIL

+0

我糾正自己......問題是鉻只有其他瀏覽器都可以。 關於顯示:block;它會使圖像響應,但會損壞幻燈片(所有圖像同時顯示) – Sergio

+0

它只應用於所描述的活動項目。 http://www.codeply.com/go/0QUU06MiIL – ZimSystem

+0

謝謝,也正如問題21611中github所述,style =「width:100%; height:100%」正常工作。 要成爲我第一次在stackoverflow我非常滿意! – Sergio

1

對於我來說,這種解決方法對兩者都無效,辦公桌上衣和手機。我稍微調整了建議的解決方法,使其成爲 - 方向明智的。

@media (orientation: portrait) { 
    .carousel-item.active, 
    .carousel-item-next, 
    .carousel-item-prev { 
     display: block; 
     width:100%; 
     height:auto; 
    } 
} 

@media (orientation: landscape) { 
    .carousel-item.active, 
    .carousel-item-next, 
    .carousel-item-prev { 
     display: block; 
     width:100%; 
     height:96vh; 
    } 
}