スタイルをコンポーネントに追加する方法はいくつかあります。

テンプレートのHTMLに組み込まれている

stylesまたはstyleUrlsメタデータ

を設定.

CSSファイルを介して

にインポートする.
上記の役割ドメイン規則は、これらのロードモードすべてに適用されます.

メタデータのスタイル

@Component装飾器にstyles配列型属性を追加することができます.この配列の各文字列(通常は1つのみ)はCSSを定義します.
COPY CODE

 
    
 
     
@Component({
 
     
 selector: 'hero-app',
 
     
 template: `
 
     
 
Tour of Heroes
 
     
 `,
 
     
 styles: ['h1 { font-weight: normal; }']
 
     
})
 
     
export class HeroAppComponent {
 
     
/* . . . */
 
     
}
 
    
 
   

テンプレートインラインスタイル

我们也可以把它们放到