角度材料md按钮悬停颜色变化

Question

 <div class="non-active" layout layout-align='space-around center'> 
            <md-button ng-click="$ctrl.widget.type = 'chart'; $ctrl.validateForm()" layout='column'  ng-class="{selIcon : $ctrl.widget.type == 'chart'}">
                <md-icon md-menu-align-target md-svg-src="trending-up"></md-icon>
                <label>{{'LABELS.CHART' | translate}}</label>
            </md-button>
            <md-button ng-click="$ctrl.widget.type = 'card';$ctrl.validateForm()" layout='column' ng-class="{selIcon : $ctrl.widget.type == 'card'}">
                <md-icon md-menu-align-target md-svg-src="info-white"></md-icon>
                {{'LABELS.CARD' | translate}}
            </md-button>

            <md-button ng-click="$ctrl.widget.type = 'currentValue'; $ctrl.validateForm()" layout='column' ng-class="{selIcon : $ctrl.widget.type == 'currentValue'}">
                <md-icon md-menu-align-target md-svg-src="filter2"></md-icon>
                {{'LABELS.CURRENTVAL' | translate}}
            </md-button>
        </div>

   ///csss

       .selIcon {
           background: #91a865;
        }
      .non-active{

      .md-active-button:hover{
       background-color: #91a865;
       }

      }

正如您所看到的，点击时我的按钮设置为绿色而不是md-raised，而是简单的css（.selIcon {   背景：＃91a865; }）。唯一的问题是我想将悬停效果删除为灰色。单击按钮并在我悬停时变为绿色它将变为灰色。如何禁用此功能？另外，我可以将它包装在div中，因此悬停禁用仅影响此特定按钮

Answer 1

您只需定位md-button .md-button元素的类，并使用css更改background-color。默认情况下，角度材质的md-button元素具有灰色背景颜色。 Here is a working plunker