You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何去除mat-select-panel中的内边距(padding)?

去除Angular Material Select面板内边距的解决方案

针对你遇到的mat-select-panel内边距无法去除的问题,试试以下几种方案:

  • 针对MDC面板内部容器调整内边距:
    MDC风格的select面板,内边距通常来自.mdc-menu-surface__inner元素,而非外层的.mdc-menu-surface,所以修改选择器:

    ::ng-deep .mat-mdc-select-panel .mdc-menu-surface__inner {
      padding: 0 !important;
    }
    
  • 若仍有间距,检查选项的边距:
    部分情况下,选项本身的margin也会造成视觉上的空隙,可一并调整:

    ::ng-deep .mat-mdc-option {
      margin: 0 !important;
    }
    
  • 注意样式穿透的语法正确性:
    你之前写的ng:deep是旧语法,Angular推荐使用::ng-deep,确保样式能正确穿透到子组件。

内容的提问来源于stack exchange,提问作者sahus

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.12 02:32:32