CSS:将 CSS 样式应用于除 Material Angular 之外的所有内容

4 html css sass angular-material angular

如何应用 CSS 样式(justify-content: centerbox-sizing: border-box所有子元素和孙元素,除了 Material 和以 <mat 开头的任何元素?是否有一种简单的方法可以在 CSS/SCSS 中进行文本搜索?

我们将有 500 多个元素,需要有效地应用它。注意到进入 Material 的子元素内部元素,并应用 border-box 或 center 会破坏它的 display 。

我可以申请 mat 关键字搜索吗?有许多 mat div 元素,mat-input, mat-select, mat-tab, etc

尝试应用 css 开始选择器,

https://www.w3schools.com/css/css_attribute_selectors.asp

.container *not(%.mat) {
    box-sizing: border-box
}


<div class="container">
  <div class="document-holder">
    <div class>error_outline</div>
    <mat-input><mat-input>
Run Code Online (Sandbox Code Playgroud)

Kum*_*rth 5

.container *:not([class^="mat"]) {
    background: red;
}
Run Code Online (Sandbox Code Playgroud)

这就是您可能正在搜索的代码。

[class^="mat"]将匹配任何具有以 开头的类的元素mat

[class*="mat"]将匹配mat在类名中任何位置的任何元素。

根据您的情况使用它们中的任何一个。