我该如何设置`<iron-overlay-backdrop>`的背景颜色

Question

我在等待ajax请求完成时想要使用自定义元素。它由macaddress组成，但它也有<paper-spinner>。行为。它由Polymer.IronOverlayBehavior属性驱动，我有一个观察者，所以当它设置时，叠加打开。

在操作上这很好。只是背景颜色对我的网站来说是错误的。

我正在尝试根据文档设置叠加层样式，并在模板中添加以下内容

waiting

但我得到的只是黑色的默认风格，而不是我试图设置的白色。

我应该如何设置样式，以便获得半透明的白色，而不是我目前所获得的半透明黑色。

Answer 1

iron-overlay-backdrop的问题在于，它不是附加到元素的本地DOM而是附加到主DOM的单例。

因此，要设置其自定义css属性或mixins，您应该在custom-style上执行此操作，以适用于主DOM：

<style is="custom-style">
iron-overlay-backdrop {
  --iron-overlay-backdrop-background-color: #fff;
  --iron-overlay-backdrop-opacity: 0.9;
}
</style>

这里有jsfiddle显示它的实际效果