引导转盘：在CSS中将背景编辑为纯黑色

只是想知道，我一直试图使我的旋转木马纯黑色的背景，以配合我的整个网站的背景，但我似乎无法让这个工作。我觉得我错过了一些显而易见的东西，但我一辈子都看不出那是什么

这是我的旋转木马css：

.carousel {
    background-color: #000000;
    color: #000000;
    height: 500px;
    margin-bottom: 60px;
}

.carousel-caption {
    z-index: 10;
}

.carousel-caption h1 {
    z-index: 10;
}

.carousel-caption p {
    z-index: 10;
}

.carousel .item {
    height: 500px;
    background-color: #000000;
}
.carousel-inner > .item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 500px;
}

以下是我的特定转盘html：

<!-- Carousel -->
        <div id="myCarousel" class="carousel slide" data-ride="carousel">
            <!-- 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>
            <div class="carousel-inner" role="listbox">
                <div class="item active">
                    <img src="someimage" alt="First slide">
                        <div class="container">
                            <div class="carousel-caption">
                                <h1>Introducing astrobox</h1>
                                <p>sdfsdfsdf</p>
                                <p><a class="btn btn-lg btn-primary" href="#" role="button">Sign Up</a></p>
                            </div>
                        </div>
                        </div>
                <div class="item">
                    <img src="someimage" alt="Second slide">
                        <div class="container">
                            <div class="carousel-caption">
                                <h1>Another example headline.</h1>
                                <p>dfsdfsdf</p>
                                <p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a></p>
                            </div>
                        </div>
                        </div>
                <div class="item">
                    <img src="someimage" alt="Third slide">
                        <div class="container">
                            <div class="carousel-caption">
                                <h1>One more for good measure.</h1>
                                <p>sdfsdfsdf</p>
                                <p><a class="btn btn-lg btn-primary" href="#" role="button">Browse gallery</a></p>
                            </div>
                        </div>
                        </div>
            </div>
            <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>

介绍astrobox
sdfsdfsdf


另一个例子是标题。
DFSDF


再来一杯。
sdfsdfsdf

---

如果有人知道如何做到这一点，我将非常感激

在我看来它是黑色的：@amphetamachine它一定是某个家长选择器，但我的旋转木马周围有一个灰/白色边框…所有东西看起来都很好旋转木马背景是黑色的@APAD1和Niket Thapa——你们都在全屏运行它。把它放在一个容器中，问题很明显：@Ted它包含在一个颜色为ffffff的边框中