css 如何在Angular中将菜单项字体大小改为小字体?

r3i60tvu  于 2023-01-22  发布在  Angular
关注(0)|答案(1)|浏览(135)
<button [matMenuTriggerFor]="menu" mat-button>Options</button>
    <mat-menu class="mat-menu" #ServicesButton #menu="matMenu">
        <button class="mat-menu-item" mat-menu-item>Option 1</button>
        <button class="mat-menu-item" mat-menu-item>Option 2</button>
        <button class="mat-menu-item" mat-menu-item>Option 3</button>
        <button class="mat-menu-item" mat-menu-item>Option 4</button>
    </mat-menu>

现在这个菜单的css是angular的默认设置。我想改变它,但是它不能通过css类工作。
我试过使用css类。没有结果。我试过内联样式。我只能改变背景颜色。字体大小不起作用。

8aqjt8rx

8aqjt8rx1#

你确定吗,看看这个
CSS

.mat-menu-item{
  font-size: 9px;
}

超文本标记语言

<button [matMenuTriggerFor]="menu" mat-button>Options</button>
    <mat-menu class="mat-menu" #ServicesButton #menu="matMenu">
        <button class="mat-menu-item" mat-menu-item>Option 1</button>
        <button class="mat-menu-item" mat-menu-item>Option 2</button>
        <button class="mat-menu-item" mat-menu-item>Option 3</button>
        <button class="mat-menu-item" mat-menu-item>Option 4</button>
    </mat-menu>

https://stackblitz.com/edit/mat-menu?file=app%2Fmenu-icons-example.html,app%2Fmenu-icons-example.css

相关问题