Question

我按照this教程制作Carousel幻灯片。

当我定义每个项目包含图像和段落为 -

时

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

工作正常（here its jsFiddle）。

但是当我把它减少为段落时 -

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

它停止工作（here its jsFiddle）。

我怎样才能使它只使用段落，这样每个开关都会滑动文本？

Answer 1

.carousel-caption 的position属性导致了问题，图片没有变得混乱，因此将其设置为static：

.carousel-caption{
    position:static;
}

以下是使用和不使用图像的演示：

<强> DEMO

Answer 2

See after removing image and leaving only paragraph

我给了item容器类图像的宽度和高度，背景颜色为div表示存在只是复制并粘贴此代码在小提琴css部分并运行以查看更改

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

Answer 3

最简单的方法就是制作背景色的图像。如果你想要一个更简洁的方法，你可以使用CSS实现相同的效果。

Answer 4

我有同样的问题。这个答案最简单，并针对此问题优化了解决方案：https://stackoverflow.com/a/25535930/4792775

Bootstrap.js Carousel只有文字

4 个答案: