如何使聚合物中的纸张菜单按钮下拉菜单透明？

我想让<paper-menu-button>的下拉菜单透明，但它不适用于我。我使用此代码：如何使聚合物中的纸张菜单按钮下拉菜单透明？

<paper-menu-button> 
    <paper-icon-button icon="menu" slot="dropdown-trigger"></paper-icon-button> 
    <paper-listbox slot="dropdown-content"> 
    <paper-item>Share</paper-item> 
    <paper-item>Settings</paper-item> 
    <paper-item>Help</paper-item> 
    </paper-listbox> 
</paper-menu-button>

我试过--paper-menu-button-dropdown-background: rgba(255,255,255,.5);，但它不工作。

来源

2017-07-14 Amanshu Kataria

的<paper-listbox>默认情况下并在<paper-menu-button>的下拉菜单的背景之上不透明的，所以你必须做下列之一：

让ListBox的背景透明，看看下面的颜色（尽管清除列表框覆盖了按钮图标，这可能会使文本难以阅读）。

<dom-module id="x-foo"> 
    <template> 
    <style> 
     paper-listbox { 
     /* transparent to show bg of paper-menu-button underneath */ 
     --paper-listbox-background-color: transparent; 
     } 

     paper-menu-button { 
     --paper-menu-button-dropdown-background: rgba(0,0,255,.5); 
     } 
    </style>

demo

或列表框的背景色设置为预期颜色：

<dom-module id="x-foo"> 
    <template> 
    <style> 
     paper-listbox { 
     --paper-listbox-background-color: rgba(0,0,255,.5); 
     } 
    </style>

demo

来源

2017-07-15 02:54:28 tony19

它的工作。有没有什么办法摆脱重叠按钮图标的菜单。我尝试了noOverlap =“true”，但没有奏效。 –

与no-overlap =“true”一起工作。 –

如何使聚合物中的纸张菜单按钮下拉菜单透明？

回答

相关问题