角度ngx-bootstrap輪播未居中

Question

我正在嘗試使用ngx-bootstrap中的Carousel，但布局與我期望的不一樣。

我添加了一些樣式CSS來使其居中，但仍然無法正常工作，這是它的外觀：

這是我在組件中的代碼：

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  styles: [`.carousel { margin:0px auto }`]
})
export class AppComponent {
  title = 'app';
}

這是我的HTML模板：

<carousel>
  <slide>
    <img src="assets/images/nature/5.jpeg" alt="First slide">
  </slide>
  <slide>
    <img src="assets/images/nature/6.jpeg" alt="Second slide">
  </slide>
  <slide>
    <img src="assets/images/nature/7.jpg" alt="Third slide">
  </slide>
</carousel>

謝謝您的幫助！

Answer 1

當我從以下位置更改時，它起作用了：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet">

到版本3：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

在index.html中