预定义样式不会改变答案

【问题标题】：Predefined styles won't change预定义样式不会改变
【发布时间】：2019-03-24 16:39:43
【问题描述】：

这可能是个愚蠢的问题：

我正在开发我的第一个 Angular2，第 7 版（学校项目）SPA，我正在使用 Material Angular 框架。该框架要求我使用他们预定义的样式表之一。我是，但我想更改 matInput 标签上的填充。由于它生成了很多代码中未显示的内容，但您可以在检查视图中看到它，我认为我在 css 中的选择器可能无法正常工作？

这是我添加的：

.mat-form-field-wrapper,
.mat-form-field-infix,
.mat-form-field-appearance-legacy {
  padding: 0 !important;
}

因为在检查视图中，我一直在玩弄不同的生成元素，我已经能够确定我需要更改的位置，但我不会这样做（再次因为我认为matInput 生成了很多我在编写时无法定位的代码？）。我基本上需要更改 .mat-form-field-wrapper 的填充。

有人有解决办法吗？

【问题讨论】：

您可以尝试将样式添加到您的全局样式表吗？你在使用角度cli吗？ material.angular.io/guide/customizing-component-styles

标签： css angular input angular2-forms

【解决方案1】：

试试这个

/deep/.mat-form-field-appearance-legacy {
  padding: 0 !important;
}

【讨论】：

我以前见过 /deep/ 但我想知道它有什么作用？
它用于在使用模拟视图封装时允许对子组件进行样式设置。更多信息可以在这里找到：angular.io/guide/component-styles@MoutPessemier
仅将此作为最后的手段。它很快就会被弃用。
@alt255 那你将如何解决它，因为我确实读过它很快就会贬值但它可以在atm工作。
替代方案：您可以在 styles.css 或 main.css 中编写代码，无需深入。我的回答解决了你的问题吗？ @MoutPessemier