如何在Angular 2/5中的自定义标签上应用CSS？

Question

我已经将Google ReCaptcha(ng-recaptcha)组件安装到我的应用程序中,并且想知道是否有办法将一些样式应用于生成的子元素,在我的情况下,<re-captcha></re-captcha>元素.

例如:

re-captcha{
    border: 1px solid #ccc; /*works*/
}

re-captcha div{
    border: 1px solid #ccc; /*doesn't work*/
} 

您能否分享一些实现预期结果的经验？

更新:

但是,如果直接在DevTools中设置,则以下工作正常...

re-captcha div{
    border: 1px solid #ccc; 
} 

Answer 1

这是由组件的视图封装设置引起的.

您可以使用/deep/或::ng-deep选择器来定位Native或Emulated(默认)模式中的子组件,其中abbasak的答案将起作用.