添加 Bootstrap 轮播时 HTML 内部项目突然消失

Question

我一直在制作一个用户项目部分，我希望这些项目处于轮播中。所以我决定导入 bootstrap carousels，但我的项目在这样做时突然消失了。我在平板电脑上编码，因为我没有电脑，所以我什至 100% 不知道我正确关闭了 div。请问有什么帮助吗？这是我的代码：

<div class="userProjects" id="userProjects"> <!--line number: 126-->
        <h1> User Projects </h2> <!--line number: 173-->
        <div id="carouselExampleSlidesOnly" class="carousel slide" data-bs-ride="carousel">
         <div class="carousel-inner">
        <div class="carousel-item active">
        <div class="clockImg">
            <img class="rounded clockSS" src="" alt="JS Clock"> <!--line number: 165-->
        </div>
        <h2> JavaScript Clock </h2>
        <p class="lead leadTwo"> One of the very first projects that he recommends is a simple, easy to make                javascript clock.
        </p> <!--line number: 180-->
    </div> <!--fadeInUserProjects div closing...-->
    </div>
    </div>
    </div>
    </div>
    </div>

抱歉缩进不好。我还稍微修改了 Bootstrap css 以尝试修复它：

        .carousel-inner,
        .carousel-item {
            width: 100vw;
            position: absolute;
            left: -20%;
            height: 180%;
            color: white;
        }

Answer 1

.carousel-inner, .carousel-item {
            width: 100vw;
            position: absolute;
            left: -20%;
            height: 180%;
            color: white;
        }

您将这两个类都设置为 180% height 是这样吗？检查一下。