ViewEncapsulation

このエントリーをはてなブックマークに追加

ViewEncapsulationはコンポーネントのCSSのカプセル化をどのように行うかの設定です。

ViewEncapsulationはComponentのencapsulationプロパティに対して指定ができ、デフォルトではViewEncapsulation.Emulatedが指定されています。

ViewEncapsulation.Emulatedではコンポーネントのパーツを識別できる属性を付与し、他のコンポーネントに対してスタイルが反映されないようにします。

ViewEncapsulation.Noneを指定するとCSSはグローバルに展開され他のコンポーネントなどに影響が反映されるようになります。

ViewEncapsulation.Nativeを指定するとShadow DOMによるカプセル化が行われます。

@Component({
  selector: "body",
  encapsulation: ViewEncapsulation.None,
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

参考URL

ViewEncapsulation enum - Angular

登録日 : 2017年01月28日 最終更新日 : 2017年1月28日

同じカテゴリー(@angular/core)のエントリー

検索

スポンサードリンク

バージョン

リファレンス