此问题适用于Ionic，但其答案可能更广泛地适用于CSS。我不确定。
我使用的是ionic 4，它创建具有特定样式的阴影DOM元素。我有以下内容：
<ion-item>
<ion-label position="floating">Floating Label</ion-label>
<ion-input></ion-input>
</ion-item>
我希望“浮动标签”文本在浮动时比平常更向左移动。我可以使用标签本身上的样式很容易地做到这一点。
但是，在ion-item下创建的影子DOM div具有自己的样式，包括overflow: hidden。我还没有从样式表中找到更新这些样式的方法。我尝试使用/deep/和其他各种选择器，但这些选择器似乎无法正常工作，并且对它们的支持也似乎已被删除。我了解您可以使用CSS变量，但是此特定属性overflow不是由变量设置的。我也了解您可以使用DOM将样式注入到影子DOM中，但是我想避免这样做，因为我将不得不在每个组件中的某个位置执行此操作，而不是只能在整个应用程序中执行一次。
如果变量不可用，是否有任何方法可以使用CSS覆盖影子DOM中设置的样式？
答案 0 :(得分：0)
您应该尝试使用ng-deep选择器直接操作DOM元素样式。
::ng-deep {
.your-class { // Used to contain your deep change to a localized node
your style
}