css Angular 垫误差不占据其自身空间

xmq68pz9  于 2023-03-20  发布在  Angular
关注(0)|答案(2)|浏览(122)

我有一个带有mat-error的表单,我想用空格来分隔,我知道我可以简单地分隔表单字段本身,但是我一直在尝试给mat-error元素添加margin/padding/border,它们都被应用了,但是它们没有移动。

至于CSS,我已经尝试了我能想到的大多数方法来强迫它移动。样式被应用,但实际上什么也没有改变。

mat-error{
    display: block !important;
    position: relative !important;
    margin-bottom: 40px !important;
    padding-bottom: 40px !important;
    z-index: 999;
  }

为什么会这样呢?

wvyml7n5

wvyml7n51#

1.将css更改为class:.mat-error而不是mat-error
1.要更改角形材料中的样式,应定义在angular.json配置文件的样式数组中声明的全局样式表,并自定义其中的所有垫样式。
在样式.css中:

.mat-error {
    color: aqua;
}

结果将是:

请阅读Customizing Angular Material component styles文章以获得更好的解释。

jogvjijk

jogvjijk2#

我也遇到了同样的问题,这是一个kluge,但我可以通过增加这些类的边距和填充来做到这一点:

.mat-form-field-appearance-outline .mat-form-field-wrapper {
  margin: 0.25em 0 1.2em 0 !important;
}
.mat-form-field-appearance-outline .mat-form-field-subscript-wrapper {
  padding: 0 0.5em !important;
}

相关问题