Html 引导转盘，仅适用于大型运输车

我几乎已经完成了我的主页引导转盘。只有一个小问题我不明白。它只在类为jumbotron的div中工作。为什么呢

如果我周围没有一个巨无霸，它什么也看不出来

一些代码：

<div class="container-fluid">

    <div class=".col-md-6">

        <!-- Full Page Image Background Carousel Header -->
        <header id="myCarousel" class="carousel slide">
            <!-- Indicators -->
            <ol class="carousel-indicators">
                <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                <li data-target="#myCarousel" data-slide-to="1"></li>
                <li data-target="#myCarousel" data-slide-to="2"></li>
            </ol>

            <!-- Wrapper for Slides -->
            <div class="carousel-inner">
                <div class="item active">
                    <!-- Set the first background image using inline CSS below. -->
                    <div class="fill" style="background-image: url('/images/hotel1.jpg');"></div>
                    <div class="carousel-caption">
                    </div>
                </div>
                <div class="item">
                    <!-- Set the second background image using inline CSS below. -->
                    <div class="fill" style="background-image: url('/images/hotel2.jpg');"></div>
                    <div class="carousel-caption">
                    </div>
                </div>
                <div class="item">
                    <!-- Set the third background image using inline CSS below. -->
                    <div class="fill" style="background-image: url('/images/hotel3.jpg');"></div>
                    <div class="carousel-caption">
                    </div>
                </div>
            </div>

            <!-- Controls -->
            <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                <span class="icon-prev"></span>
            </a>
            <a class="right carousel-control" href="#myCarousel" data-slide="next">
                <span class="icon-next"></span>
            </a>

        </header>

    </div>


</div>

<!-- jQuery -->
<script src="js/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>

<!-- Script to Activate the Carousel -->
<script>
    $('.carousel').carousel({
        interval: 5000 //changes the speed
    })
</script>

html,
body {
    height: 100%;
}

.carousel,
.item,
.active {
    height: 100%;
}

.carousel-inner {
    height: 100%;
}



.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

footer {
    margin: 50px 0;
}

---

希望有人能看到并引导我朝正确的方向前进，因为这是我制作的第一个旋转木马。

您的问题源于多个小问题：

我没有做太多更改，您忘记了标题中的数据：

<header id="myCarousel" class="carousel slide" data-ride="carousel">

而你旋转木马前的那个div有一个错误的等级：

<div class=".col-md-6"><!--it shouldn't have the dot there-->
<div class="col-md-6"><!--we both know how frustating these little dots can be-->

---

您的问题源于多个小问题：

我没有做太多更改，您忘记了标题中的数据：

<header id="myCarousel" class="carousel slide" data-ride="carousel">

而你旋转木马前的那个div有一个错误的等级：

<div class=".col-md-6"><!--it shouldn't have the dot there-->
<div class="col-md-6"><!--we both know how frustating these little dots can be-->

它仍然只适用于jumbotron类。。。不是col-md-6类或任何其他：（它仍然只适用于jumbotron类…不是col-md-6类或任何其他：（它仍然只适用于jumbotron类…不是col-md-6类或任何其他：(