更新-最新方式
如果可以避免，请不要这样做。正如Devon Sans在评论中指出的那样：该功能很可能已被弃用。
更新-较新的方式
从 Angular 4.3.0开始 ，不推荐使用所有可穿透的CSS组合器。Angular团队推出了一种新的组合器 ::ng-deep
（仍然处于实验水平，而不是完整的最终方法），如下所示，
styles: [ ` :host { color: red; } :host ::ng-deep parent { color:blue; } :host ::ng-deep child{ color:orange; } :host ::ng-deep child.class1 { color:yellow; } :host ::ng-deep child.class2{ color:pink; } `],template: ` Angular2 //red <parent> //blue <child></child> //orange <child ></child> //yellow <child ></child> //pink </parent> `旧方法
您可以使用
encapsulation mode和/或
piercing CSS combinators >>>, /deep/ and::shadow
styles: [ ` :host { color: red; } :host >>> parent { color:blue; } :host >>> child{ color:orange; } :host >>> child.class1 { color:yellow; } :host >>> child.class2{ color:pink; } ` ],template: ` Angular2 //red <parent> //blue <child></child> //orange <child ></child> //yellow <child ></child> //pink </parent> `
