Question

这是我的HTML：

 <md-tabs  md-dynamic-height >
                    <div>
                        <md-tab label="Tab 1">

                        </md-tab>
                        <md-tab label="Tab 2" >

                        </md-tab>
                        <md-tab  label="Tab 3" >

                        </md-tab>

                    </div>
                </md-tabs>

单击选项卡时需要更改标签颜色和边框底部颜色。提前谢谢

Answer 1

＆＃34;边界底部＆＃34;它是使用md-tabs.md-default-theme md-ink-bar, md-tabs md-ink-barr{ color: rgb(255,82,82); background: rgb(255,82,82); }创建的，这里是默认选择器：

md-tabs .md-tab.md-active{
    color: rgb(16,108,200);
}

md-tabs.md-default-theme .md-tab, md-tabs .md-tab{
    color: rgba(0,0,0,0.54);
}

此处标签为active / inactive：

String a;
String b = new String("Hello");

要进行正确的样式自定义，您可以创建一个自定义主题，覆盖标准颜色而不创建自定义CSS，请检查DOC

Answer 2

添加脚本和CSS。

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>

    <script>
    $(document).ready(function(){
        $("div md-tab").click(function(){
            $(this).addClass("active");
        });
    });
    </script>

    <style>
    .active{
    border-bottom: 1px solid #000;
        color: #f44336;
    }
    </style>

有没有办法改变标签颜色和活动标签边框底部颜色？

2 个答案: