angular - 如何减小 MatSelect DropDown Panel 的大小
问题描述
我正在尝试减小 mat-select 下拉面板的默认大小,但不知道该怎么做
我试过给出宽度,试过在角垫选择中覆盖面板类,但尺寸似乎没有下降
我的模板文件
<div class="col-md-8">
<mat-form-field style="float: right">
<mat-select panelclass="my-panel" placeholder="Select Course"(selectionChange)="selectCourse($event,courses)" disableOptionCentering>
<mat-option *ngFor="let course of courses" [value]="course.courseId">
{{course.courseCode}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
我的 CSS 文件
.my-panel {
background: orange;
height: 300px;
display: flex;
flex-direction: column;
justify-content: space-between;
min-width: 350px !important;
}
解决方案
您可以通过将以下 css 添加到主styles.css
文件来设置 mat-select 的宽度。
.mat-form-field-infix{
width: 80px !important;
}
根据您的要求更改 80px。
推荐阅读
- c - 在程序集 mips 64 (winmips64) 中创建具有多个参数的 C 函数
- r - 用 ggplotly 分别为 r 中的每个图设置刻面图的刻度
- ubuntu - HAProxy UDP 负载平衡
- html - Css 类立即更改而不是使用转换
- azure-devops - 在管道任务内部访问批准步骤注释
- sql - MS SQL - 获取每个 ID 的匹配字段
- docker - YAML 错误错误:在解析“<unicode string>”中的块映射时,
- reactjs - PrivateRoute 中的重定向不呈现我的页面
- macos - 如何在 NSTextInputClient 中检查输入法的状态?
- c++ - 当没有任何构造函数时如何从元组构造对象