如何使聚合物中的紙張菜單按鈕下拉菜單透明？

我想讓<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」一起工作。 –

如何使聚合物中的紙張菜單按鈕下拉菜單透明？

回答

相關問題