- 确保你已经正确地导入了Angular Material组件库以及CSS文件:
import { NgModule } from '@angular/core';
import { MatSelectModule } from '@angular/material/select';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@NgModule({
imports: [
MatSelectModule,
BrowserAnimationsModule
],
exports: [
MatSelectModule
]
})
export class MyMaterialModule { }
- 在HTML文件中添加一个mat-form-field元素来包含mat-select元素:
{{option.name}}
- 在CSS文件中修改mat-select的样式,例如:
mat-select {
width: 100%;
height: 50px;
font-size: 1.2em;
color: #333;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
padding: 10px;
}
mat-select:hover {
border-color: #555;
}
mat-select:active {
border-color: #777;
}