如何覆盖材质 CSS 样式?

2024-03-03

我使用角度材质 2。

Material CSS 中有一种 CSS 样式:

.mat-radio-button.mat-accent .mat-radio-inner-circle {
  background-color: #fff;
}

我尝试在自定义 CSS 文件中覆盖它,例如:

.mat-radio-button.mat-accent .mat-radio-inner-circle {   background-color: red !important; }

我也尝试过这个:

/deep/ .mat-radio-button.mat-accent .mat-radio-inner-circle {
  background-color: red !important;
}

它不起作用,如何正确执行此操作以及在哪里执行此操作?


您可以在全局样式表中执行此操作(style.scss),或者在任何样式表中not封装的。

要覆盖,请通过检查浏览器中的 HTML 元素来获取选择器,然后覆盖所需的属性。

如果仍然失败,您可以使用!important强制应用样式。

请记住在您的样式表导入中订购angular.json也提交文件(谢谢@SurenSrapyan提醒我)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何覆盖材质 CSS 样式? 的相关文章

  • 通过innerHTML输入时span不应用css样式

    我有 Angular 应用程序 作为它的一部分 我在 div 中显示查询结果 具有 JSONContainer 的 ID 我想突出显示结果中的特定查询 因此我使用了一个管道来搜索结果 并将文本中的 FIELD VALUE 替换为 span
  • 如何在 angularjs 4 中设置 http 调用超时?

    我在 angularjs 4 官方页面上看到过 https angular io guide http https angular io guide http 设置http调用超时但我没有找到任何参考 有人尝试过设置吗 谢谢 如果您使用 R
  • @Component 和 @View 的区别

    我试图找出 AngularJS 2 中 Component 和 View 之间的区别 在下面的两个例子中我可以实现完全相同的事情 没有 View的示例 import Component from angular2 core Componen
  • 在 Angular 中显示 formControlName 的验证消息

    我有以下 Angular 注册表单
  • 如何将 zingchart 实现到 Angular2 中

    我有一个现有的项目 我想在其上实施 zingcharts 我尝试了 3 个不同的教程 主要来自 https blog zingchart com 2016 07 19 zingchart and angular 2 charts back
  • 将 SCSS 与使用 angular-cli 创建的 Angular 库结合使用

    我创建了一个角度库项目 我想在其中使用 SCSS 样式 所以我已经配置了 ng config schematics schematics angular component styleext scss 这进入了角度 json file sc
  • Angular 2\4 哈希 url 保留index.html

    背景 Angular 4 ng cli RouterModule useHash true 当我使用浏览到我的应用程序时http server index html它决定http server url 中省略了index html 此外 每
  • 角度2中未定义的值

    我正在创建一个应用程序 在其中使用 Ag Grid api 在网页上列出我的数据库内容 Ag grid 有一个预定义的 api 来获取所选行的内容 这是我的代码 export class customer entryComponent pu
  • 您必须位于 angular-cli 项目中才能使用serve命令

    我正在尝试运行拖放示例dragula https github com valor software ng2 dragula 但是当我跑步时ng serve它抱怨 You have to be inside an angular cli p
  • 拖动元素时是否禁用 mousemove 事件?

    我试图通过在拖动元素时观察文档上的 mousemove 事件来移动元素 使用 html5 拖放 我在文档的父元素上添加了一个 mousemove 侦听器 每当我移动鼠标时都会触发该监听器 但是一旦我开始拖动另一个子元素 我就不再看到 mou
  • 添加 PayPal 付款方式 Ionic

    我正在尝试在我的用 Ionic 2 3 制作的应用程序上实现 PayPal 付款方式 我已经安装了 ionic cordova plugin add com paypal cordova mobilesdk npm install save
  • 如何在 Angular @Input 中仅接受预定义值

    我的问题是 我在 a 中收到一个字符串值作为组件的参数 但我想限制可以用作参数的值 就像enum I use Input type string 但是在组件中 一切都可以引入type正如我之前所说 我需要将其限制为 3 个选项 例如Enum
  • 如何通过自定义指令动态添加组件

    我想编写一个自定义指令 它将根据 div 内的某些逻辑动态添加组件 我在其中使用了自定义指令 我尝试使用 componentFactoryResolver 和 viewContainerRef createComponent 动态添加组件
  • 是否可以在 Angular Material Tooltip 中包含一个列表?

    基本上我想在我的工具提示中有一个 ul 元素 我正在使用 Angular 5 以及 Angular 5 的兼容材质 帕维尔 阿加科夫 Pavel Agarkov 的评论方向是正确的 为了让事情变得简单 创建一个自定义管道来自动将文本转换为项
  • 如何在 Angular 4 中翻译 mat-paginator?

    你知道如何在 Angular 中翻译 每页项目 吗mat paginator标签 这mat paginator是材料设计中的一个元素 您可以使用MatPaginatorIntl为了这 威尔 豪厄尔制作 https github com an
  • 在 Angular 单个组件中导入第 3 方 javascript 库

    我目前正在开发 Angular4 应用程序 我想import some JavaScript 库 but 仅针对单个组件 目前我可以通过在里面定义它们的路径来轻松导入这个库 angular cli json像那样 scripts node
  • Angular7:NullInjectorError:没有 FormGroup 的提供者

    我真的很沮丧 因为我不知道发生了什么 今天早上一切正常 就在我进行一些更改以将 ReactiveForm 中的 2 个表单合并在一起之前 现在我在浏览器中收到以下错误 错误 StaticInjectorError AppModule For
  • 有角度的动态背景图片

    在 html 模板中 我有这种带有动态图像的样式 div style background none width 200px height 150px div 它适用于网络浏览器和 Android 浏览器 但是 使用 style 的动态背景
  • Angular:如何动态更改 scss 变量?

    我对 scss 很陌生 所以我想知道是否可以使用组件的 Typescript 来更改 scss 变量 所以考虑一下 html div div scss thememode theme1 textcolormode nonHover colo
  • 如何确定所有角度2分量都已渲染?

    当所有 Angular2 组件完成渲染时 是否会触发一个角度事件 For jQuery 我们可以用 function 然而 对于 Angular2 当domready事件被触发 html 只包含角度组件标签 每个组件完成渲染后 domrea

随机推荐