Papier-Dropdown-Menü Schriftgröße

Question

Ich versuche, die Schriftgröße von was in einem paper-dropdown-menu ausgewählt ist, aber alles, was ich versucht habe, ist fehlgeschlagen. Ich habe versucht:

--paper-input-container-label: {font-size: 8px;}; 
--paper-input-container-input: {font-size: 8px;}; 
--paper-input-container: {font-size: 8px;}; 
--paper-dropdown-menu: {font-size: 8px;}; 
--paper-dropdown-menu-input: {font-size: 8px;}; 
--paper-item: {font-size: 8px;}; 
--paper-item-selected: {font-size: 8px;}; 

Jedesmal wurde die Regel in der :root Wähler setzen aber keines dieser Arbeit ...

hier ist mein Code:

<paper-dropdown-menu no-label-float class="rowsSelector"> 
    <paper-menu class="dropdown-content" selected="{{limit}}" attr-for-selected="value"> 
     <template is="dom-repeat" items="{{options}}"> 
     <paper-item value="{{item}}">{{item}}</paper-item> 
     </template> 
    </paper-menu> 
    </paper-dropdown-menu> 

Answer 1

Sie müssen setzen Es ist in einem "style is =" custom-style "" -Tag und target das Tag mit einer Klasse oder ID, es sei denn, Sie haben nur ein Dropdown-Menü oder wollen sie alle die gleiche Schriftart, Schriftgröße usw. haben.

Fügen Sie den folgenden Stilcode hinzu, um die Schriftart auf 20px einzustellen. Beachten Sie, dass die Klasse auf das Element ausgerichtet ist, das ich stylen möchte. Die Klasse in meinem Beispiel ist "test". Wenn Sie keine Klasse verwenden möchten, richten Sie einfach alle Papier-Dropdown-Menüelemente aus, indem Sie .test mit Papier-Dropdown-Menü ändern.

Wenn Sie Ihren benutzerdefinierten Stil in eine eigene Datei trennen möchten, glaube ich, dass es eine HTML-Datei sein muss, damit es funktioniert.

<style is="custom-style"> 
    .test { 

     --paper-input-container-label: { 
      font-size: 20px; 

     }; 
    } 
</style> 
<paper-dropdown-menu class="test" label="Dinosaurs"> 
    <paper-listbox class="dropdown-content"> 
     <paper-item>allosaurus</paper-item> 
     <paper-item>brontosaurus</paper-item> 
     <paper-item>carcharodontosaurus</paper-item> 
     <paper-item>diplodocus</paper-item> 
    </paper-listbox> 
</paper-dropdown-menu>