如何在mat-card中设置mat-card-title
如何在mat-card中设置mat-card-title
提问于 2021-10-28 04:52:37
我想要截断垫卡标题的溢出。使用
overflow:hidden
text-overflow:ellipsis
white-space: nowrap但是该样式被标准的垫卡样式覆盖。我同样使用了mat-card-header ::ng-deep，但我认为ng-deep现在已经被弃用了。有没有人知道同样的更好的方法？
回答 2
Stack Overflow用户
发布于 2021-10-28 05:00:38
您可以覆盖css类，而不是使用ng deep。
转到主css文件common/style并从浏览器检查material类。
使用您在browser中找到的完整类名。
应用css，保存并运行。
Stack Overflow用户
发布于 2021-10-28 05:35:13
这可能会有所帮助：
<mat-card class="example-card">
<mat-card-header>
<mat-icon>more_vert</mat-icon>
<div mat-card-avatar class="example-header-image"></div>
<mat-card-title title="This is a test title header">This is a test title header</mat-card-title>
<mat-card-subtitle>Dog Breed</mat-card-subtitle>
</mat-card-header>
</mat-card>你可以在你的组件中覆盖css类，比如你的组件是(app.component.css)：
.mat-card-title {
overflow:hidden ;
text-overflow:ellipsis;
white-space: nowrap;
width: 30vw;
}您必须为文本溢出省略号指定宽度，谢谢
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69748465
复制相关文章
相似问题
腾讯云开发者
