角度材質カスタムクラスボタン問題

Question

角度材質ボタンのカスタムクラスを作成しようとしていますが、ボタンをクリックしてブラウザから移動（最小化または別のウィンドウをアクティブ化）すると、それはフェードアウトまたは白くなり、ブラウザウィンドウをクリックすると、適切な形状/色に変わりますが、その理由はわかりませんが、どのように制御するのかは分かりません。 私のCSSクラス：

.DeleteBtn.md-raised { 
 
    color: #fff; 
 
    background-color: #CC090F; 
 
    text-transform: initial; 
 
    min-width: 88px; 
 
    margin: 6px 0px; 
 
    max-width: 8px; 
 
    font-size: 12px; 
 
} 
 

 
.DeleteBtn.md-raised:not([disabled]):hover { 
 
    color: #fff; 
 
    background-color: #7F0509; 
 
    max-width: 10px; 
 
    font-size: 12px; 
 
}

<md-button class="md-raised DeleteBtn">Delete</md-button>

Answer 1

あなたはすべてのコンポーネント.md-buttonのための基本CSSクラスが欠落しています。ここで働いてCSSスニペットです：

.md-button.DeleteBtn.md-raised:not([disabled]).md-focused,.md-button.DeleteBtn.md-raised { 
    color: #fff; 
    background-color: #CC090F; 
    text-transform: initial; 
    min-width: 88px; 
    margin: 6px 0px; 
    max-width: 8px; 
    font-size: 12px; 
} 

.md-button.DeleteBtn.md-raised:not([disabled]):hover { 
    color: #fff; 
    background-color: #7F0509; 
    max-width: 10px; 
    font-size: 12px; 
} 

私は<md-button>CSSについての詳細を読むとベストプラクティスに従うことをお勧めします。あなたのための実例もここにあります： https://codepen.io/anon/pen/ybdzZJ 希望はあなたを助けるでしょう。幸運:)