Question

我试图更改paper-dropdown-menu中所选内容的字体大小，但我尝试过的所有内容都失败了。我试过了：

--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;};

每次，规则都放在:root选择器中但这些都不起作用......

这是我的代码：

  <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

你需要把它放在＆＃39; style is =＆＃34; custom-style＆＃34;＆＃39;使用类或ID标记和定位标记，除非您只有一个下拉菜单或希望它们都具有相同的字体，字体大小等。

添加以下样式代码以将字体调整为20px。注意该类以我想要样式化的元素为目标，我的例子中的类是＆＃34; test＆＃34;。如果您不想使用课程，只需通过纸张下拉菜单更改.test来定位所有纸张下拉菜单元素。

如果您想将自定义样式分隔到自己的文件中，我相信它必须是一个HTML文件才能工作。

<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>

纸张下拉菜单字体大小

1 个答案: