Bootstrap.js Karussell mit nur Text

Question

Ich folge this Tutorial, um Carousel Folie zu machen.

Wenn ich jedes Element definieren enthalten Bild und Absatz als -

<div class="item"> 
    <img src="http://placehold.it/1200x480" alt="" /> 
    <div class="carousel-caption"> 
     <p>Caption text here</p> 
    </div> 
</div> 

es Arbeit in Ordnung (here its jsFiddle).

Aber wenn ich es zu Absatz reduzieren nur als -

<div class="item"> 
    <div class="carousel-caption"> 
     <p>Caption text here</p> 
    </div> 
</div> 

es aufhören zu arbeiten (here its jsFiddle).

Wie könnte ich es mit nur Absatz so arbeiten lassen, dass der Text jeden Schalter schieben?

Answer 1

Die position Eigenschaft der .carousel-caption das Problem verursacht wurde, ohne das Bild, um es drunter und drüber geht, so eingestellt, dass es zu static:

.carousel-caption{ 
    position:static; 
} 

Hier ist die Demo davon sowohl mit Arbeit und ohne Bild:

DEMO

Answer 2

See after removing image and leaving only paragraph

Ich gab die Artikel Containerklasse die Breite und Höhe des Bildes mit einer Hintergrundfarbe div die Anwesenheit, um anzuzeigen, einfach kopieren und diesen Code in Fiedel css Abschnitt einfügen und ausführen, um die Änderung zu sehen

.item{ 
    height:480px; 
    width:1200px; 
    background-color:orange; 
} 

Answer 3

Der einfachste Weg ist einfach, Bilder mit Hintergrundfarbe zu erstellen. Wenn Sie einen saubereren Weg möchten, können Sie wahrscheinlich den gleichen Effekt mit CSS erzielen.

Answer 4

ich hatte dasselbe Problem. Diese Antwort ist am einfachsten und optimale Lösung für dieses Problem: https://stackoverflow.com/a/25535930/4792775