2017-07-18 14 views
0

私は、ngx-bootstrapからカルーセルを使用しようとしていますが、私の予想どおりのレイアウトではありません。angular ngx-bootstrapカルーセルが中心にない

私はそれを中心にいくつかのスタイルのCSSを追加しましたが、まだそれは、ここでは、働いていない、それがどのように見えるかです:

enter image description here

、ここでは、コンポーネントの私のコードです:

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> 

あなたのためにありがとうp!

私はから変わったときにそれが働いた

答えて

0

:index.htmlを

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

:バージョン3に

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

関連する問題