Angular material 为手机角材料web应用程序创建非常小的select语句非常困难

我在使用角度和材料设计组件为手机创建web应用程序时遇到了麻烦。为了让我的网络应用在手机上正常工作，它需要有小按钮和小选择语句。不幸的是，框架似乎正在为select元素添加一个样式语句。style语句正在指定元素的宽度，而它指定的宽度太大了。如何指定小型select语句

下面是两个输入文件的关键部分：app.component.html和app.component.css。第三部分展示了Angular2生成的代码，正如我在Chrome开发工具中看到的那样。该代码的关键部分是style语句（style=“width:139.325px；”）。如果我使用开发工具更改宽度，那么我可以得到我想要的按钮大小。我只是不知道如何使用CSS文件获得我想要的大小

——生成的Ang2代码-----
玩家数量4

——我试图覆盖app.component.css中select语句的css-----
md选择{
字体大小：10px；
填充：1px；
最小宽度：12px；
}
md选项{
字体大小：10px；
填充：1px；
最小宽度：12px；
}

---My app.component.html---------
{{mynum.name}

我的罗马尼亚朋友塞吉乌帮我解决了这个问题。框架创建封装md select和md option元素的元素。不能使用app.component.css为md select和md选项之外的元素设置样式。为了控制这些元素，您需要将它们添加到base styles.css文件中。这些类足以为我收缩select语句

.mat-select,
.mat-select-trigger,
.mat-select-placeholder,
.cdk-overlay-pane,
.mat-select-panel,
.mat-select-content
{
    min-width: 40px !important;
    width: 40px !important;
}
.mat-option {
    padding: 0 2px!important;
}

---

我的罗马尼亚朋友塞吉乌帮我解决了这个问题。框架创建封装md select和md option元素的元素。不能使用app.component.css为md select和md选项之外的元素设置样式。为了控制这些元素，您需要将它们添加到base styles.css文件中。这些类足以为我收缩select语句

.mat-select,
.mat-select-trigger,
.mat-select-placeholder,
.cdk-overlay-pane,
.mat-select-panel,
.mat-select-content
{
    min-width: 40px !important;
    width: 40px !important;
}
.mat-option {
    padding: 0 2px!important;
}