Question

我尝试更改所选标签中底栏的颜色，但没有成功。我可以改变文本的背景颜色和颜色，但不能更改条形图。顺便说一句，这就是我所做的：

<paper-tabs selected="0" >

        <paper-tab>TAB1</paper-tab>
        <paper-tab>TAB2</paper-tab>
        <paper-tab>TAB3</paper-tab>

    </paper-tabs>
    <style shim-shadowdom>

        body.core-narrow {
            padding: 8px;
        }

        paper-tabs, core-toolbar {
            background-color: #00bcd4;
            color: #fff;
            box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.2);
        }

        core-toolbar paper-tabs {
            box-shadow: none;
        }

        paper-tabs[noink][nobar] paper-tab.core-selected {
            color: #db352c;
        }

        paper-tabs.transparent-teal {
            background-color: transparent;
            color: #00bcd4;
            box-shadow: none;
        }

        paper-tabs.transparent-teal::shadow #selectionBar {
            background-color: #00bcd4;
        }

        paper-tabs.transparent-teal paper-tab::shadow #ink {
            color: #00bcd4;
        }

        h3 {
            font-size: 18px;
            font-weight: 600;
        }

    </style>

我想要的颜色是color: #db352c;但是酒吧仍然是黄色的！我怎么能改变它？

Answer 1

点击此链接：polymerElements/paper-fab

示例代码：

 paper-fab {
        --paper-fab-background: #db352c;
        --paper-fab-keyboard-focus-background: red;
      }

Answer 2

docs显示有一个自定义属性可让您更改选择栏的颜色：

--paper-tabs-selection-bar-color

聚合物更改选项卡中的选定条形颜色

2 个答案: