更改选项卡文本的颜色和实体化框架中的下划线

Question

materialize选项卡的默认颜色为粉红色.也是活动标签的下划线.我想自定义并添加一些样式.我怎么做？

Answer 1

图像: 悬停时激活选项卡和 Tab2

CSS中代码更改为上述2张图片中的效果:

        .tabs .tab a{
            color:#000;
        } /*Black color to the text*/

        .tabs .tab a:hover {
            background-color:#eee;
            color:#000;
        } /*Text color on hover*/

        .tabs .tab a.active {
            background-color:#888;
            color:#000;
        } /*Background and text color when a tab is active*/

        .tabs .indicator {
            background-color:#000;
        } /*Color of underline*/

Answer 2

将自定义 CSS 添加到 Materialize 1.0.0 默认选项卡的最佳方法如下：

.tabs .tab a {
  color: rgba(38, 166, 154, 0.7);
  /*Custom Text Color*/
}

.tabs .tab a:hover {
  color:#26a69a;
  /*Custom Color On Hover*/
}

.tabs .tab a:focus.active {
  color:#26a69a;
  /*Custom Text Color While Active*/
  background-color: rgba(38, 166, 154, 0.2);
  /*Custom Background Color While Active*/
}

.tabs .indicator {
  background-color:#26a69a;
  /*Custom Color Of Indicator*/
}

*如果您想保留框架的默认样式，请使用示例中的 RGBA 值。