重新設計md-select容器

Question

Hy

什麼是重新設計md-select窗口的優雅方法。例如，我想改變背景和懸停效果。

我已經嘗試過在css中更改.md-select-menu-container，但這不起作用。我看到材料添加了一個新的Div圍繞它的MD選擇菜單

style="display: block; left: 593px; top: 70px; min-width: 139.469px; font- size: 12px;" 

這就是我想改變。 任何幫助，將不勝感激

謝謝！

Answer 1

可以使用md-container-class的造型 - CodePen

從docs：

標記

<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp" layout-margin> 
    <md-input-container style="margin:50px"> 
    <label>Bird</label> 
    <md-select ng-model="birdType" md-container-class="mySelect"> 
     <md-option ng-repeat="bird in birds" value="{{bird}}">{{bird}}</md-option> 
    </md-select> 
    </md-input-container> 
</div> 

CSS

.mySelect md-select-menu { 
    background: yellow; 
    margin-left: 100px; 
    margin-top: 50px; 
} 

.mySelect md-content { 
    background: yellow; 
} 

.mySelect md-option:hover { 
    background: pink !important; 
}