Bootstrap Carousel中的幻灯片不是以水平形式出现，而是仅以垂直形式出现

本文介绍了Bootstrap Carousel中的幻灯片不是以水平形式出现，而是仅以垂直形式出现的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 29岁程序员，3月因学历无情被辞！ 当前行为 Bootstrap Carousel中的幻灯片不会出现，幻灯片只会垂直出现。在轮播中，我们希望幻灯片只会水平放置，我还附加了当前的行为截图。 预期的行为 轮播中的幻灯片应像下面的示例屏幕截图一样水平放置（示例链接 https://ng-bootstrap.github.io/#/components/carousel/examples ） 使用说明将问题最小化 从github链接 https://github.com/gg-gg-v1/v1_ComponentsWithSEO 运行npm install 运行ng serve --o 将在浏览器中启动 示例存储库 https://github.com/gg-gg-v1/v1_ComponentsWithSEO 环境 Angular CLI：6.2.1 节点：8.11.3 OS：win32 x64 Angular：6.1.7 。 ..动画，通用，编译器，compiler-cli，核心，形式 ... http，语言服务，平台浏览器 ...平台浏览器动态，平台服务器，路由器 slider.component.tsslider.component.tsimport { Component, OnInit } from '@angular/core';import { NgbCarouselConfig } from '@ng-bootstrap/ng-bootstrap';@Component({ selector: 'app-slider', templateUrl: './slider.component.html', styleUrls: ['./slider.component.css'], providers: [NgbCarouselConfig] // add NgbCarouselConfig to the component providers})export class SliderComponent implements OnInit { images = [1, 2, 3, 4].map(() => `https://picsum.photos/900/500?random&t=${Math.random()}`); constructor(config: NgbCarouselConfig) { // customize default values of carousels used by this component tree config.interval = 10000; config.wrap = false; config.keyboard = false; config.pauseOnHover = false; } ngOnInit() { }} slider.component.htmlslider.component.html <ngb-carousel *ngIf="images"> <ng-template ngbSlide> <img [src]="images[0]" alt="Random first slide"> <div class="carousel-caption"> <h3>10 seconds between slides...</h3> <p>This carousel uses customized default values.</p> </div> </ng-template> <ng-template ngbSlide> <img [src]="images[1]" alt="Random second slide"> <div class="carousel-caption"> <h3>No mouse events...</h3> <p>This carousel doesn't pause or resume on mouse events</p> </div> </ng-template> <ng-template ngbSlide> <img [src]="images[2]" alt="Random third slide"> <div class="carousel-caption"> <h3>No keyboard...</h3> <p>This carousel uses customized default values.</p> </div> </ng-template> <ng-template ngbSlide> <img [src]="images[3]" alt="Random fourth slide"> <div class="carousel-caption"> <h3>And no wrap after last slide.</h3> <p>This carousel uses customized default values.</p> </div> </ng-template> </ngb-carousel>推荐答案您需要安装bootstrap：npm install bootstrap @ 4 将其链接（通过index.html），并且相同的代码将起作用you need to install bootstrap: npm install bootstrap@4link it in (via index.html) and the same code will work这也记录在> https://github.com/ng-bootstrap/ng-bootstrap/issues/2141 这篇关于Bootstrap Carousel中的幻灯片不是以水平形式出现，而是仅以垂直形式出现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！