css - 如何在 Angular 8 中覆盖自定义组件 css
问题描述
我试图覆盖自定义组件选择器的 css,但它不起作用。我试过:ng-deep
没有成功。我该如何找到解决方案?
app.component.html:
<mycustommcomp></mycustommcomp>
app.component.css:
::ng-deep mycustommcomp{
margin:2px;
overflow:unset !important;
}
mycustomcomp.component.css:
mycustommcomp{
margin:8px;
overflow:hidden !important;
}
演示:https ://stackblitz.com/edit/angular-vsdzqs?file=src/app/app.component.css
解决方案
您不能这样做,因为样式不能应用于组件标签。使其工作的一种方法是使用容器(例如 div)将内容包装在 mycustommcomp 中。
mycustommcomp.component.html:
<div class="container">
<!--Content here-->
</div>
app.component.css:
::ng-deep .container{
margin:2px;
overflow:unset !important;
}
mycustomcomp.component.css:
.container{
margin:8px;
overflow:hidden !important;
}
尽管如此,请避免这样做,因为 ::ng-deep 已弃用。
推荐阅读
- ios - Html音频播放器音频停在中间
- php - Symfony 4 在注释中使用来自不同命名空间的实体
- python - 修改django测试通过django-otp登录
- c# - 如何以编程方式转到 VS 编辑器中的行/列?
- javascript - Vuejs:如何将 vue js prop 值作为值传递给 html 的属性?
- javascript - 使用 Flask "Uncaught SyntaxError: Unexpected token <" 为 create-react-app 提供服务
- react-native - 错误:捆绑失败:错误:无法解析模块`react-native
- amazon-s3 - 我在 s3 上上传图像后,图像已上传但损坏,我做错了什么?
- python-3.x - 遍历目录,查找 .xls 文件,glob 忽略它们(Python 和 glob 模块)
- c# - 使用参数启动 VNC-VIewer