聚合物中的css特异性和css变量

我用的是聚合物，我想这是一个很好的选择，但我不能完全确定

在我的主要文件中，我有：

<style is="custom-style">
      :root {
        --child-element-bg: #000;
        --child-element-mixin: {
              border: 10px solid #f30;
       };
     }
</style>

<parent-element>
     <child-element></child-element>
</parent-element>

：根{
--子元素bg:#000；
--子元素mixin：{
边框：10px实心#f30；
};
}

在我的子元素中，我有这个样式块

<style>
    :host {
        background-color: var(--child-element-bg, --some-other-default);
        @apply(--child-element-mixin);
    }
</style>

：主持人{
背景色：var（--子元素bg，--其他一些默认值）；
@应用（--子元素混合）；
}

一切都很好。但是，在父元素中，我有：

 <style>
    :host {
        --child-element-bg: #f30;
        --child-element-mixin: {
              border: 5px solid #000;
       };
    }
</style> 

：主持人{
--子元素bg:#f30；
--子元素mixin：{
边框：5px实心#000；
};
}

My child元素获得5px纯色#000，但不获得#f30背景色

---

我做错什么了吗？这是已知的错误吗？

这不是错误。这就是Polymer实现css变量的方式。

我开始认为这是不可行的？有人能证实吗？没有办法覆盖在特定元素中以自定义样式设置为：root的变量吗？因此没有办法解决这个问题吗？就我目前所知，您的：root变量将获胜。我忘了我已经发布了这个问题，所以我不记得在哪里找到它，但如果我没有弄错的话，让它正常运行是一个性能问题。所以限制是：根