今天这篇主要讨论一下Angular框架如何处理样式。
Angular如何隔离样式
因为Angular是组件话的,每一个Component有自己的样式文件,那么Angular是如何保证多个组件之间的样式不会互相影响的呢?
Angular的样式封装
Angular中有三种样式封装方式:
Emulated
:默认的样式封装方式,通过给每个组件的样式添加一个唯一的属性,来实现样式的隔离。ShadowDom
:使用原生的Shadow DOM来实现样式的隔离。None
:不对样式进行封装,直接使用全局样式。
关于这三种样式封装方式的详细介绍,可以参考angular-view-encapsulation。