Angular 的样式封装

Posted by Shen Chaoran on August 22, 2018

ViewEncapsulation

  • None:样式不做封装,相当于每个组件写的样式都是全局样式
  • Native:使用原生的 Shadow DOM 来进行样式封装。这时全局样式不能应用于组件内
  • Emulated:ng 默认的样式封装方式,全局样式可以作用于组件内。

几个选择器

  • ::ng-deep
  • /deep/
  • host
  • host(.selector)
  • host-context
  • host-context(.selector)