Benutzerdefinierte CSS-Stile für die Angular-Material-Benutzeroberfläche

Question

<p>Ich verwende das Mat-grid-tile-Tag und habe festgestellt, dass es eine CSS-Klasse verwendet. Mat-grid-tile -content, der unten kopiert und eingefügt wird.

1

0

0

P粉696146205

Antwort

Antworte allen(1)

Ich werde antworten Schließen

P粉1667793632023-08-03 11:11:25 1 Etage

不幸的是，由于封装的原因，改变Angular Material的CSS并不简单。您可以参考以下链接了解更多信息:https://material.angular.io/guide/customizing-component-styles。

没有推荐的方法来修改Angular材质样式，因为它们的设计不容易改变。然而，如果你仍然想继续，有三种可能的方法:

禁用封装:禁用封装会影响组件中的所有CSS样式，包括模板中其他组件的子元素。你可以在这里了解更多:https://angular.io/guide/view-encapsulation。

覆盖Angular项目根目录下的style.css文件中的.mat-grid-tile-content类。任何CSS样式都将应用于项目中的任何HTML模板。如果更改没有生效，请尝试在属性末尾使用!important关键字。

使用::ng-deep(已弃用):虽然::ng-deep已弃用，但一些开发人员仍然喜欢它，因为没有完美的替代方案。不过要小心，因为弃用可能会在将来导致问题。

总之，不建议修改Angular材质样式，但如果你选择这样做，请考虑每种方法的潜在后果。

Wie +0

Antwort hinzufügen 关闭回复

P粉696146205

Antwort

Answer 1

不幸的是，由于封装的原因，改变Angular Material的CSS并不简单。您可以参考以下链接了解更多信息:https://material.angular.io/guide/customizing-component-styles。

没有推荐的方法来修改Angular材质样式，因为它们的设计不容易改变。然而，如果你仍然想继续，有三种可能的方法:

禁用封装:禁用封装会影响组件中的所有CSS样式，包括模板中其他组件的子元素。你可以在这里了解更多:https://angular.io/guide/view-encapsulation。

覆盖Angular项目根目录下的style.css文件中的.mat-grid-tile-content类。任何CSS样式都将应用于项目中的任何HTML模板。如果更改没有生效，请尝试在属性末尾使用!important关键字。

使用::ng-deep(已弃用):虽然::ng-deep已弃用，但一些开发人员仍然喜欢它，因为没有完美的替代方案。不过要小心，因为弃用可能会在将来导致问题。

总之，不建议修改Angular材质样式，但如果你选择这样做，请考虑每种方法的潜在后果。