角度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中的