angular + material 修改组件的样式 在全局的css文件中添加

/*控制下拉框的宽度和文字的位置*/

.mat-form-field-infix {

width:150px !important;

margin-top: -20px;

}

 

/*这是控制下拉框选中以后的底线颜色*/

.mat-form-field.mat-focused .mat-form-field-ripple {

background-color:white;

width:0px;

}

 

/*这是select初始的下拉框颜色*/

.mat-form-field-appearance-legacy .mat-form-field-underline {

background-color:white;

}

 

/*控制下拉框的边框*/

.mat-form-field {

border:solid 1px;

border-radius:4px;

height: 20px;

}

 

/*下拉框选中后倒三角的颜色*/

.mat-form-field.mat-focused.mat-primary .mat-select-arrow {

color:red;

}

 

 

不用重新填写原有的属性，新的属性添加后，页面会自动生成相同名字的不同属性